4

假设我有两个文本框：

<input type="text"id="resourceName" placeholder="Resource name"/>
<input type="text" id="barCode"  placeholder="barCode(EAN-13)"/>

要填充此文本框，我使用条形码扫描仪和键盘。我想要的有点困难，我不知道该怎么做。我无法区分用户何时使用键盘填充文本框和何时使用条形码。我需要这个因为我想实现类似的东西：当用户使用条形码扫描仪并且如果我们没有聚焦的文本框，我想聚焦条形码文本框并将这个值插入这个文本框，当焦点是资源名称文本框时，首先我想要关注 barCode 文本框，然后将此值插入此文本框。我不想让用户使用条形码扫描仪在 resourceName 文本框中插入条形码。问题是我无法区分事件，用户如何填充 textboxex？，使用条形码扫描仪或使用键盘。任何帮助将不胜感激。

4

4 回答 4

3

放弃我在评论中提出的想法，我想出了这个......

var _keybuffer = "";

$(document).on("keyup", function(e) {
    var code = e.keyCode || e.which;
    _keybuffer += String.fromCharCode(code).trim();
    // trim to last 13 characters
    _keybuffer = _keybuffer.substr(-13);

    if (_keybuffer.length == 13) {
        if (!isNaN(parseInt(_keybuffer))) {
            barcodeEntered(_keybuffer);
            _keybuffer = "";
        }
    }
});

function barcodeEntered(value) {
    alert("You entered a barcode : " + value);
}

它保留最后 13 个按键的缓冲区，如果它只是数字，则假定它是条形码并触发该barcodeEntered功能。这显然是一个 hack，并假设没有理由有人会在页面的其他地方键入 13 位数的数字（但如果某些字段有焦点等，你可以让它忽略按键。）

它捕获页面上的所有按键，无论焦点如何，因此即使没有焦点，它也应该捕获您扫描条形码。

编辑：根据@DenisBorisov 的建议，我已添加.trim()到键盘缓冲中，以便忽略空格。

于 2013-11-13T16:37:01.253 回答
3

看看github jQuery-Scanner-Detection

NPM 包 jQuery-Scanner-Detection

jQuery Scanner Detection 是一个小插件，用于检测用户何时使用扫描仪（条形码、二维码...）而不是键盘，并调用特定的回调。

于 2014-05-01T13:12:04.063 回答
1

看一下jQuery的keypress事件

将此绑定到您的输入框，当用户使用键盘输入条形码时它会提醒您

另外，你见过这个问题吗？

于 2013-11-13T16:05:18.280 回答
0

尝试了所有解决方案，但没有按预期工作。我找到了非常简单的解决方案 onscan.js 我有使用 angular 8 的应用程序。

非常简单和良好的实现。

对于角度 8，我按照以下步骤操作：

1.npm install onscan.js --save

2.打开angular.json，在脚本数组中添加一个条目为“node_modules/onscan.js/onscan.min.js”

3.在组件类中，实现接口AfterViewInit

declare var onscan:any;
  ngAfterViewInit(): void {
    //Put focus to textbox and press scanner button
    onScan.attachTo(document, {
      suffixKeyCodes: [13], // enter-key expected at the end of a scan
      reactToPaste: true, // Compatibility to built-in scanners in paste-mode (as opposed to keyboard-mode)
      onScan: function (sCode, iQty) { // Alternative to document.addEventListener('scan')
        console.log('Scanned: ' + iQty + 'x ' + sCode);
      },
    });
  }

最好的事情是扫描的文本出现在集中的文本框元素中

于 2021-06-17T09:47:45.297 回答