ASCII控制字符html输入文本

use*_*080 9 html javascript ascii control-characters

我正在尝试在javascript浏览器应用中处理来自条形码扫描仪的输入.扫描仪输出是一串字符,其中还包含至少一个组分隔符(ASCII 29).

当我将输入指向ie notepad ++时,输入会正确显示,包括Group Separator字符.当我将输入定向到<input type="text">html字段时,组分隔符对象丢失; 它既不在现场可见,也不能用javascript代码检测到.

<input type="text">对象是否截断ASCII控制字符?知道如何避免这种情况吗?

编辑: 我使用的代码类似于Raidox的答案来实现这个目的:

    inputField.onkeypress = catchGroupSeparatorAndEnter;
    var fncChar = String.fromCharCode(29);

    function catchGroupSeparatorAndEnter(event) {
    if (event.ctrlKey && event.which === 29) {
    inputField.value = inputField.value + fncChar;      
    event.preventDefault();
    event.stopPropagation();
}
...
}
Run Code Online (Sandbox Code Playgroud)

这似乎适用于Chrome和Edge,但不适用于Firefox.我不知道如何让它在那里工作.

小智 6

过去一周我也一直在努力解决这个问题,今天我终于取得了突破。我不知道你的条码扫描器是如何工作的,但我们的就像一个 USB 键盘并发送单独的按键。它确实发送 [GS] 的按键,但浏览器会自动取消该事件。因此它永远不会到达 input 事件,该事件是将字符添加到您的输入的事件。我想不出一种方法来防止它取消,但是您可以通过在按键事件中手动将字符添加到输入中来解决这个问题。

我不知道您正在为您的应用程序使用什么框架,但我能够通过将其构建到自定义指令中来使其与 AngularJS 一起使用。下面的示例只是普通的 JavaScript,但您应该能够将它实现到您可能使用的任何框架中。

原生 JavaScript 示例

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Control Character Test</title>
    </head>
    <body>
        <input type="text" id="tacos" />
        <script>
            document.getElementById('tacos').addEventListener('keypress', function(e) {
                if (e.charCode === 29) {
                    this.value += String.fromCharCode(e.which);
                }
            });
        </script>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

您可以将上面的代码保存到 HTML 文件中,以测试此方法是否适用于您的条码扫描仪。如果这不起作用,另一种值得探索的可能性是重新编程您的条形码扫描仪以发送每个按键,然后这种方法应该有效。

另一个相关行为

在我的研究中,我还发现如果输入与其他字符同时发送,它们确实会接受这些字符。例如,我们有另一个条码扫描器,它将条码数据作为一个事件发送。浏览器接受带有 [GS] 字符的输入。您也可以通过复制/粘贴来做到这一点。你也可以利用这种行为来获得你想要的东西。

浏览器问题

值得记住的是,由于您使用的浏览器,您也可能会遇到使用这些方法中的任何一种的问题。我们一次性发送所有数据的条码扫描器是一个安卓设备。它有 2 个浏览器,chrome 和一个专有浏览器。[GS] 字符显示在 Chrome 中,但不是专有浏览器。

希望这可以帮助!