【问题标题】:Handle a keyboard that produces only keypress instead of keydown/keyup events处理只产生 keypress 而不是 keydown/keyup 事件的键盘
【发布时间】:2013-09-07 06:18:55
【问题描述】:

我遇到一种奇怪的情况,专用 PC 键盘在按下数字键时会在 JavaScript 中产生奇怪的代码。

使用这个网站 (http://unixpapa.com/js/testkey.html),我发现键盘在按下数字 4 时会产生这种情况:

keydown  keyCode=18        which=18        charCode=0        
keydown  keyCode=101 (e)   which=101 (e)   charCode=0        
keyup    keyCode=101 (e)   which=101 (e)   charCode=0        
keydown  keyCode=98  (b)   which=98  (b)   charCode=0        
keyup    keyCode=98  (b)   which=98  (b)   charCode=0        
keyup    keyCode=18        which=18        charCode=0        
keypress keyCode=52  (4)   which=52  (4)   charCode=52  (4)  

普通键盘会产生这样的结果:

keydown  keyCode=52  (4)   which=52  (4)   charCode=0        
keypress keyCode=52  (4)   which=52  (4)   charCode=52  (4)  
keyup    keyCode=52  (4)   which=52  (4)   charCode=0        

所以基本上,这个奇怪的设备持有 ALT 键,添加另外两个字符,放开 ALT 键,然后只触发实际键的 keypress 事件,而完全忽略 keydown 和 keyup。

我可以用event.altKey 过滤掉第一部分没问题,但导致问题的是其余部分。

问题是我的代码被编写为在 keydown 上做一件事,在 keyup 上做另一件事,并且只为这个键盘添加 keypress 会搞砸一切......

我怀疑是否有解决方案,我们可能只是不支持这个......奇怪的硬件,但以防万一:

关于如何检测键盘是否只创建按键(在过滤掉之前的其他 event.altKey 事件之后)有什么想法吗?

我尝试使用一个包含当前事件代码的全局变量,该变量在 keypress 和 keyup 时都被重置,否则会接收当前的 keycode,但我无法让它工作......

这是我的代码:

<input type="text" name="entry" id="entry" onkeyup="Entry('up', this, event);" onkeydown="Entry('down', this, event);" />

是的,所有键盘事件都应该传递到文本字段中,所以这里不需要return。 还有 JavaScript:

function Entry(dir, field, evt)
{
    // filter out Num Lock, Alt and Alt Pressed
    if (evt.keyCode == 144 || evt.keyCode == 18 || evt.altKey)
        return false;

    if (dir == 'up')  // keyup
    {
        if (field.value.length > 0) 
        { 
            if (evt.keyCode == 13) // Enter pressed
            {
                EnterUser();  // if more entries are found with FindUser(), select the first one, otherwise empty the screen
            }
            else 
            {
                FindUser();  // start ajax that checks field content vs database
            }
        }
    }
    else  // keydown
    {
        if (!field.disabled)
        {
            EmptyScreen();  // if the text field is disabled because a dialog box is in front, empty the screen.
        }
    }
}

当然,诀窍是支持这种奇怪的键盘,同时不破坏其他键盘和当前工作的条形码扫描仪。

我们可能不得不告诉客户“抱歉,给自己找个合适的键盘”之类的,但这让我很烦 :-)

对此有什么想法吗?

谢谢!

PS:我在那个网站上有 jQuery,所以如果有任何使用它的好主意,我也会参与其中。

【问题讨论】:

  • 大胆猜测:您可以尝试的一件事是使用addEventListener() 来连接您的事件处理程序,以防传递给该回调的event 对象与您的对象有所不同/更好。通过在 HTML 中使用 onkeyup 重新获取。
  • 您已经解释了该键盘的作用,但您知道为什么它会这样做吗?它是专为残障人士设计的可编程键盘吗? (如果是这样,它可能具有“正常”模式。)
  • 据我所知,这是某种形式的收银员或 POS 键盘。我希望它可以重新编程以不这样做:-)(今天回家,明天继续回复,谢谢!)
  • 此行为可能会根据您运行的 javascript 引擎而改变...如果可以的话,可能值得尝试不同的浏览器。
  • 不幸的是,我无法预测我们的客户可能会使用哪种浏览器......到目前为止,我们似乎一直不支持这种奇怪的键盘。感谢收看!

标签: javascript jquery events event-handling


【解决方案1】:

我也偶然发现了这个问题。配置为以 alt 代码发送文本的条码扫描器也可以执行此操作。

至少对于 Chrome 来说有一个简单的解决方案(我没有检查过 firefox),但是 IE 和 Edge 都需要不同的方法,因为这些浏览器无法为 Alt 引发 KeyUp 事件strong> 密钥,这是解决方案的重要组成部分。

谷歌浏览器注册 Alt keyUp 事件,并且事件翻译“alt-code”。您需要做的就是在按住 Alt 键时跳过键,并在 Alt @987654326 上检查 key 属性@事件:

对于 IE 和 Edge 浏览器,您需要在按住 alt 键的同时保存字符,将它们转换为数字并使用String.fromCharCode(057) 得到“9”,问题是很难检测何时转换,因为“alt-code”之后的Alt按钮没有KeyUp事件。

我选择并且适用于每个浏览器(我认为)的解决方案是将隐藏的输入字段集中在 KeyDownevent 上,用于 Alt 键,并在更改后读取其内容,因为输入正确处理“Alt 代码”

这可能是迟到的答案,但可能对其他人有用。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-02-20
    • 2014-02-13
    • 1970-01-01
    • 2011-03-23
    • 2014-11-22
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多