在 jQuery 中检测单个按键事件上的多个键

IT技术 javascript jquery keypress jquery-events
2021-01-26 23:23:31

是否有可能结合按键'的混合来触发单个事件?

$(document).keyup(function(e){
    if (e.keyCode == 68 && e.keyCode == 69 && e.keyCode == 86) {
        alert('oh hai');
    }
});

我已经在 Chrome 中尝试过,但该事件没有触发。

叫我疯了,但我正在编写一个 Chrome 扩展程序,并希望将D+ E+V到一起以强制它进入隐藏的开发人员模式。

6个回答

如果要检测的dev钥匙都在同一时间全部下来,你得看都keydownkeyup并保持地图为down的那些的。当它们全部关闭时,触发您的事件。

例如:实时复制| 来源

var map = {68: false, 69: false, 86: false};
$(document).keydown(function(e) {
    if (e.keyCode in map) {
        map[e.keyCode] = true;
        if (map[68] && map[69] && map[86]) {
            // FIRE EVENT
        }
    }
}).keyup(function(e) {
    if (e.keyCode in map) {
        map[e.keyCode] = false;
    }
});

我假设您不在乎按什么顺序按下它们(因为可靠地按下会很痛苦),只要它们在某个时间点同时按下即可。

@Vega:修饰键是另一种鱼。
2021-03-19 23:23:31
mm 正如您所提到的,我认为顺序对于键盘快捷键很重要..ctrl+vv+ctrl
2021-03-30 23:23:31
@DreamWave:不,keyup处理程序清除标志。
2021-04-01 23:23:31

类似于 Vega 的……但更简单

var down = {};
$(document).keydown(function(e) {
    down[e.keyCode] = true;
}).keyup(function(e) {
    if (down[68] && down[69] && down[86]) {
        alert('oh hai');
    }
    down[e.keyCode] = false;
});​
像魅力一样工作,也感谢@lu1s 的钥匙订单!:)
2021-03-16 23:23:31
这真的很好,而且效果很好。如果您需要匹配一系列键,那么您可以通过推送到数组来检查顺序:而不是down[e.keyCode]=true,说down.push(e.keyCode)和验证而不是 this: if(down[68]&&down[69]&&down[86]),如 this: if(down[0]===68&&down[1]===69&&down[2]===86)
2021-03-23 23:23:31
我创建了一个小提琴来补充 lu1s 评论。
2021-03-29 23:23:31

也许更简单的组合键会更容易?

像 Shift + Alt + D 这样的东西怎么样?(您可能不应该使用 Control 键,因为大多数浏览器已经以某种方式解释了 Ctrl+D)

代码如下:

if(e.shiftKey && e.altKey && e.keyCode == 68)
{
  alert('l33t!');
}
@ParthThakkar - 从这个问题,你可以得出这样的要求:“强制它进入隐藏的开发者模式”。务实,我建议了一个简单的替代方案来实现相同的最终结果
2021-03-13 23:23:31
根据评论@GPlumb 中的讨论,您最好加入关于这是所考虑方法的替代方法以及为什么...
2021-03-23 23:23:31
好吧......那可能是要走的路......我只是认为这不是所需问题的答案,所以我只是问......没有冒犯!)
2021-03-25 23:23:31
这不是问题的答案,是吗?
2021-03-30 23:23:31

对于想要避免使用 Jquery 的人,我从TJ Crowder那里得到了纯 javascript 的回答

//A W S D simultaneously
var map = {65: false, 87: false, 83: false, 68: false};
document.body.addEventListener('keydown', function (e) {
    var e = e || event; //to deal with old IE
    if (e.keyCode in map) {
        map[e.keyCode] = true;
        if (map[65] && map[87]) {
            console.log('up left');
        }else if (map[83] && map[68]) {
            console.log('down right');
        }else if (map[87] && map[68]) {
            console.log('up right');
        }else if (map[83] && map[65]) {
            console.log('down left');
        }
    }
});
document.body.addEventListener('keyup', function (e) {
    if (e.keyCode in map) {
        map[e.keyCode] = false;
    }
});

您需要分别捕获三个关键事件,并仅在第三个事件之后触发您的操作。

var keys = {
        d: { code: 100, pressed: false, next: 'e' },
        e: { code: 101, pressed: false, next: 'v' },
        v: { code: 118, pressed: false, next: 'd' }
    },
    nextKey = 'd';

$(document).keypress(function(e) {
    if (e.keyCode === keys[nextKey].code) {
        keys[nextKey].pressed = true;
        nextKey = keys[nextKey].next;
    } else {
        keys.d.pressed = false;
        keys.e.pressed = false;
        keys.v.pressed = false;
        nextKey = 'd';
    }

    if (keys.d.pressed && keys.e.pressed && keys.v.pressed) {
        alert('Entering dev mode...');
    }
});​

当然,有很多方法可以做到这一点。此示例不需要您同时按住键,只需按顺序键入它们:d e v

如果你使用了它,你可能想要增加它以pressed在一段时间间隔后清除标志。

这是一个工作示例


免责声明:我意识到原来的问题是说键应该“按在一起”。这只是一种替代方法,因为其他回答者已经为按键一起按下提供了足够的解决方案。

我在 Chrome 中对此进行了测试,但它不适用于原始密钥代码。我以前遇到过这个,但我忘记了为什么它们不同。
2021-03-31 23:23:31