바코드 스캐너에서 여러 값을 가진 간단한 HTML 양식 입력 필드

Question

바코드 스캐너는 매 스캔마다 키 코드 13을 보내는 또 다른 키보드라는 것을 알고 있습니다. 입력 필드가 하나만있는 매우 간단한 양식을 가지고 있습니다. 여러 번 스캔 할 수 있기를 원합니다. 바코드를 입력하고 POST 데이터 제출을 클릭하십시오. 나는 이것을 위해 javascript가 필요할 것이라고 생각하지만, 나는 javascripts와 잘 맞지 않는다.

최종 결과는 다음과 같습니다. 여러 바코드가 스캔 된 것을 볼 수 있으며 그림의 하단에 나타납니다.

목표는 키보드를 터치하지 않고 원하는 바코드 수를 스캔하는 것입니다. 스캔을 완료하면 마우스를 클릭하여 제출 버튼을 누릅니다. 제출을 클릭하면 다른 페이지에 게시해야합니다.

나는이 자바 스크립트에서 좋은 사람에 대한 간단한 일입니다 확신합니다.

다음은 HTML 양식 코드입니다.

<form action="myform5.php" method="post"> 
    <p>First name: <input type="text" name="serial" /></p> 
    <input type="submit" name="submit" value="Submit" /> 
</form> 

내 질문에 내가 위에서 설명한 내용을 어떻게 할 수 있습니까?

미리 감사드립니다.

Answer 1

이렇게하면됩니다.

var codes = ""; 
 
var codes_el = document.getElementById('codes'); 
 
var output_el = document.getElementById('output'); 
 

 
function process_key(event){ 
 
    
 
    var letter = event.key; 
 
    
 
    if (letter === 'Enter'){ 
 
    event.preventDefault(); 
 
    letter = "\n"; 
 
    event.target.value = ""; 
 
    } 
 
    
 
    // match numbers and letters for barcode 
 
    if (letter.match(/^[a-z0-9]$/gi)){ 
 
    codes += letter; 
 
    } 
 
    
 
    
 
    codes_el.value = codes; 
 
    output_el.innerHTML = codes; 
 
}

<form method="POST" action="myform5.php"> 
 
    <input onkeydown="process_key(event)" /> 
 
    <input type="submit" value="Send" /> 
 
    <input type="hidden" name="codes" id="codes" /> 
 
</form> 
 

 
<pre id="output"> 
 
</pre>

는 그런 다음과 같이 myform5.php에서 얻을 수 있습니다 :

<?php 
// codes will be a string of barcodes seperated by "\n" 
$codes = $_POST['codes']; 

// get as array like so 
$barcodes = explode("\n", $codes); 

// build up string of barcodes 
$barcode_str = ""; 
$prefix = ''; 
foreach ($barcodes as $barcode){ 
    $barcode_str .= $prefix . "'" . $barcode . "'"; 
    $prefix = ', '; 
} 

$query = "select * from hdds where serial IN (" . $barcode_str . ");"; 

/* do things with query here */ 

// once your done processing 
// redirect the user back to the form page 
header("Location: FormPage.html"); 
?> 

내가 당신의 바코드가 DB에 문자열 가정합니다.

그래서 각 바코드를 검색어로 묶어야합니다.