代码之家 › 专栏 › 技术社区 › RMorrisey

例如,e.keycode-如何区分和号和上箭头?

keycode keypress internet-explorer-7 jquery javascript

RMorrisey · 技术社区 · 15 年前

我正在和一个非常奇怪的javascript行为作斗争,这个行为发生在我试图修复的jquery ui小部件上。 IE7(Win XP),jQuery 1.2.6(是的,它是旧版本)。

这个小部件是一个组合框,它捕获键盘事件并对箭头键具有特殊的行为。

当我试图在flexbox输入字段中键入“&字符时,我会得到奇怪的行为。

flexbox有如下代码:

//initialization
$myInputElement.keypress($.flexbox.process_key);
$.flexbox.process_key = function process_key(e) {
    $.flexbox.flexboxFromInput(this).processKey(e);
    return true;
};

//on the flexbox object's prototype:
...
    processKey: function processKey(e) {
        var mod = 0;
            if (typeof (e.ctrlKey) !== 'undefined') {
                if (e.ctrlKey) mod |= 1;
                if (e.shiftKey) mod |= 2;
            } else {
                if (e.modifiers & Event.CONTROL_MASK) mod |= 1;
                if (e.modifiers & Event.SHIFT_MASK) mod |= 2;
            }
            ...
            switch (e.keyCode) {
                   case 38: // up
                       this.prevResult();
                       break;
                   case 40: // down
                       if (this.getCtr().is(':visible')) this.nextResult();
                       else this.flexboxDelay(true);
                       break;
               ...etc.
           }
    }
...

当我介绍日志记录语句时,我发现按下“&”(shift+7)会产生三个按键事件:

INFO: Flexbox> processKey, keyCode=16, ctrl=false, shift=true
INFO: Flexbox> processKey, keyCode=55, ctrl=false, shift=true
INFO: Flexbox> processKey, keyCode=38, ctrl=false, shift=true

显然,key code 38是上箭头键和与号的ASCII码吗??

在我写这篇文章的时候,我突然想到,我可以检测到按键为“shift+7”(键代码55),将其视为和号键,然后设置某种标志来忽略下一个按键(即38)。这似乎是一个可怕的黑客。

有没有人有更好的方法来区分特殊字符,如“&”和IE中的箭头键?

4 回复 | 直到 11 年前

RMorrisey 14 年前

这就是我最后所做的:

    /*
     * Hack around a wierd behavior in IE where "&%'(" have the same keyCodes
     * as the arrow keys.
     */
        if (keyCodeIn(e.keyCode, 55, 53, 57) && (mod & 2) && !(mod & 1)) {
            this.ignoreNextArrowKey = true;
        }
        else if (222 === e.keyCode && !(mod & 2) && !(mod & 1)) {
            this.ignoreNextArrowKey = true;
        }
        else if (keyCodeIn(e.keyCode, 38, 37, 39, 40) && this.ignoreNextArrowKey) {
            this.ignoreNextArrowKey = false;
            return;
        }

        //...

        function keyCodeIn(keyCode) {
            for(var i = 1; i < arguments.length; i++) {
                if (arguments[i] === keyCode) {
                    return true;
                }
            }
            return false;
        }

希望这能帮助别人。如果要重用此代码,可能需要根据关键字“this”所指的对象(此处,它是与flexbox小部件关联的javascript对象)调整关键字“this”的用法。

编辑: 我更新了这段代码,并删除了以前的正则表达式测试,我发现它有问题。

Tobias Cohen 15 年前

我想 keydown 可能会给你比 keypress .

Neil McKeown 15 年前

我建议使用此jquery库编写按键的自定义处理程序: http://code.google.com/p/js-hotkeys/

试图从逻辑上辨别密码是一场噩梦。

kennebec 15 年前

键向上或向下返回“&”的键代码55,“箭头向上”的键代码38