用于处理扫描仪输入的按键事件 returns 只有第一个字符

Question

我正在使用 Datalogic Heron 扫描仪输入条码并使用此代码获取条码值 -

<input type="text" id="scannerBarcode" />

和

<script>
    document.addEventListener("keypress", function(e) {
        alert(e.key);
        $("#scannerBarcode").val(e.key);
        e.preventDefault();
        });      
</script>

我有两个问题 -

使用e.key 只返回第一个字符。我不知道如何捕获完整的条形码值。当我关注一个简单的 txt 文件时，条形码会显示整个值。
警告闪烁，不等我点击确定。

这是我第一天使用任何扫描仪，如果这是一个愚蠢的问题，请多多包涵。

任何人都可以指导如何修复上面的问题。

谢谢！

Answer 1

问题是条形码扫描仪是标准键盘输入，但如果不将该值发送到输入字段，您将无法获得您注意到的整个字符串。你可以试试我关于斑马的回答（同一个问题）

与您现有代码保持一致的另一个选项是不提醒 APPEND 每个 keypress 上的条形码值。

var barcode = document.querySelector("#scannerBarcode");
document.addEventListener("keypress",function(e){
   if(e.keyCode != 13){
       barcode.value += e.key;
   }
   e.preventDefault();
});

<input type="text" id="scannerBarcode">

Answer 2

对于由全局文档按键事件管理的条码输入，您可能会在读取条码时预料到键盘事件的爆发，因此您需要存储字符并在新扫描之间清除它们。此代码可让您附加来自快速输入序列的字符，并为新扫描清理它。

var scannerInput ="";
var lastClear=0;
document.addEventListener("keypress", function(e) {
        console.log(e.key);
        clearTimeout(lastClear);
        lastClear=window.setTimeout(function(){
           scannerInput="";
        },500);
        scannerInput+=e.key;        
        $("#scannerBarcode").val(scannerInput);
        e.preventDefault();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="scannerBarcode" type="text">

您不需要关注文本输入。将捕获按快速顺序按下的任何一组键（与从条形码接收数据的方式相同）。

如果您的条码扫描仪使用回车 Return（'Enter' 键）完成，您可以在 e.Key = 'Enter' 时清除 scannerInput 变量，而不是超时

用于处理扫描仪输入的按键事件 returns 只有第一个字符

keypress event for handling scanner input returns only first character

javascript

jquery

barcode-scanner