javascript - 用于处理扫描仪输入的按键事件仅返回第一个字符

Question

我使用 Datalogic Heron 扫描仪进行条形码输入，并使用此代码获取条形码值 -

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

和

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

我遇到两个问题 -

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

这是我第一天使用任何扫描仪，所以如果这是一个愚蠢的问题，请耐心等待。

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

谢谢!

Answer 1

对于由全局文档按键事件管理的条形码输入，您可能会在读取条形码时预计会出现一系列键盘事件，因此您需要存储字符并在新扫描之间清除它们。此代码将允许您附加来自快速输入序列的字符，并清理它以进行新的扫描。

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">

您不需要将焦点集中在文本输入上。任何快速按下的按键组都将被捕获(与从条形码接收数据的方式相同)。

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