ASCII控制字符html输入文本 [英] ASCII control character html input text

查看:276
本文介绍了ASCII控制字符html输入文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I'm trying to process input from a barcode scanner in a javascript browser app. The scanner output is a string of characters, which also contains at least one Group Separator character (ASCII 29).

当我将输入定向到记事本++时,输入正确显示,包括组分隔符.当我将输入定向到<input type="text"> html字段时,组分隔符对象丢失;它既不在字段中不可见,也无法用javascript代码检测到.

When I direct the input to i.e. notepad++, the input is displayed correctly including the Group Separator characters. When I direct the input into a <input type="text"> html field, the Group Separator objects are lost; it's neither visible in the field, nor detectable with javascript code.

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

Does the <input type="text"> object truncate ASCII control characters? Any idea how to avoid that?

我正在使用类似于Raidox的答案的代码来实现此目的:

I'm using a code similar to Raidox's answer to achieve this:

    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();
}
...
}

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

This seems to work in Chrome and Edge, but not in Firefox. I have no clue how to get it to work there.

推荐答案

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

I've been struggling with this at work for the past week as well, and I finally made a breakthrough today. I don't know how your barcode scanner works, but ours acts like a USB keyboard and sends individual keypresses. It does send the keypress for [GS], but the event is automatically canceled by the browser. Therefore it never reaches the input event, which is the event that adds the character to your input. I couldn't figure out a way to prevent it from canceling, but you can get around this by adding the character to the input manually in the keypress event.

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

I don't know what framework you are working with for your application, but I was able to get this to work with AngularJS by building this into a custom directive. The example below is just vanilla JavaScript, but you should be able to implement it into any framework that you may be using.

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

您可以将上面的代码保存到HTML文件中,以测试此方法是否适用于条形码扫描仪.如果仍然无法解决问题,则值得探索的另一种可能性是对条形码扫描器进行重新编程以发送每个按键,然后这种方法应该可以解决.

You can save the code above into an HTML file to test if this approach works with your barcode scanner. If this doesn't work as is, another possibility worth exploring is reprogramming your barcode scanner to send every keypress, and then this approach should work.

在我的研究中,我还发现,如果输入与其他字符同时发送,那么输入确实会接受这些字符.例如,我们有另一台条形码扫描仪,它将条形码数据作为一个事件发送.浏览器接受带有[GS]字符的输入.您也可以使用复制/粘贴来执行此操作.您可能会利用这种行为来获得所需的东西.

In my research, I also figured out that inputs do accept these characters if they are sent with other characters at the same time. For example, we have another barcode scanner that sends the barcode data as one event. The browser accepts this input with the [GS] character. You can also do this with copy/paste. You could potentially exploit this behavior to get what you want as well.

请记住,由于所使用的浏览器,您也可能会遇到这两种方法的问题.我们一次发送所有数据的条形码扫描仪是一个android设备.它上面有2个浏览器,一个是Chrome,另一个是专有的浏览器. [GS]字符显示为铬,但不显示专有浏览器.

It is worth keeping in mind that you might also run into problems with either of these approaches because of the browser you are using. Our barcode scanner that sends the data all at once is an android device. It has 2 browsers on it, chromium and a proprietary browser. The [GS] character shows up in chromium, but not the proprietary browser.

希望这会有所帮助!

这篇关于ASCII控制字符html输入文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆