logo标签列表

IE e.keyCode - 如何区分“&”和上箭头？

javascriptjqueryinternet-explorer-7keypresskeycode
8

我正在解决一个与jQuery UI小部件相关的非常奇怪的JavaScript行为。

使用的是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

显然，keyCode 38既是向上箭头键，也是代表“&”的ASCII代码？

当我写这篇文章时，我意识到可以将按键检测为“shift + 7”（keyCode 55），将其视为“&”键，然后设置某种标志以忽略下一个按键（即38）。这似乎是一种可怕的hack。

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

我认为IE浏览器的箭头键的keyCodes形成了一个愤怒的悲伤的表情符号：%&'（在评论文本输入字体中效果更佳）。 - RMorrisey
4个回答
3
这是我最终所做的事情：
    /*
     * 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对象）。
编辑：我更新了此代码，并删除了之前存在的正则表达式测试，我发现它有问题。
2

我认为keydown比keypress提供更可靠的数据。

谢谢你的回复！但我不确定这在我的情况下是否可行。我需要捕获每当用户对输入进行更改时触发的事件（无论是否为箭头键）。如果用户按住字母键，我认为 keydown 事件只会触发一次，即第一个输入的字母，并不是每次更改都触发？ - RMorrisey
1
0

按键向上或向下会返回 keyCode 55 表示 '&'，以及 38 表示 '箭头向上'

请看我对Tobias答案的评论。 - RMorrisey
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接