如何在jquery中绑定组合键ctrl+x+return

q3qa4bjr  于 2023-03-22  发布在  jQuery
关注(0)|答案(5)|浏览(146)

有没有什么方法可以在jquery(或者javascript)中捕捉ctrl+x+return的组合键,这样如果用户按下这个组合键,就会调用一个函数。我试过使用jquery hotkeys插件,但是没有用。

nwsw7zdq

nwsw7zdq1#

可以使用按键事件对象的ctrlKey属性

$(document).keypress(function(e) {
    if(e.ctrlKey) {
        // do code to test other keys
    }
});

shift、alt保留键也有属性,但enter键有keyCode 13。
有什么理由你不能尝试不同的组合-例如ctrl-alt-x?回车键通常是为触发表单提交和网页上的其他事件而保留的。

1dkrff03

1dkrff032#

使用全局布尔数组var keys = []检查某个键是否被按下,然后使用以下函数添加全局热键:

window.addGlobalHotkey = function(callback,keyValues){
    if(typeof keyValues === "number")
        keyValues = [keyValues];

    var fnc = function(cb,val){
        return function(e){
            keys[e.keyCode] = true;
            executeHotkeyTest(cb,val);
        };        
    }(callback,keyValues);
    window.addEventListener('keydown',fnc);
    return fnc;
};

正如您所看到的,它向'keydown'事件添加了一个新的侦听器。该侦听器将首先在keys中设置相应的值为true,然后执行一个测试,以确定给定的keyValues当前是否为true。请注意,您不能删除keys[e.keyCode] = true并将其放入另一个侦听器中,因为这可能导致错误的回调顺序(首先是热键测试,然后是键Map)。executeHotkeyTest本身也非常简单:

window.executeHotkeyTest = function(callback,keyValues){
    var allKeysValid = true;

    for(var i = 0; i < keyValues.length; ++i)
        allKeysValid = allKeysValid && keys[keyValues[i]];

    if(allKeysValid)
        callback();
};

最后,您必须向keyup添加另一个侦听器,以清除从keys释放的密钥。

window.addEventListener('keyup',function(e){
    keys[e.keyCode] = false;
});

现在,您可以使用addGlobalHotkey(callback,[13,17,88])向ctrl+x+enter添加一个热键:

addGlobalHotkey(function(){
    document.body.appendChild(
        document.createElement('div').appendChild(
            document.createTextNode('Ctrl + x + Enter down')
    ).parentNode);
},[88,13,17]);

**一个

您可以使用全局[[callback1,values1],[callback2,values2],...]数组,而不是为每个热键添加侦听器。

重要提示:在IE 9之前的版本中,你必须使用attachEvent而不是addEventListener。因为你已经在使用jQuery,你可以使用.on(...).keydown来代替。

mwkjh3gx

mwkjh3gx3#

$("body").bind("keydown",keyDown);

function keyDown(e){
    if((e.ctrlKey)&&(e.keyCode == 88)&&(e.keyCode == 13)){
        alert("Keys down are Ctrl + x + Return");
    }
}
u4vypkhs

u4vypkhs4#

只需输入如下内容:

document.getElementById('yourelementid').onkeydown = function(){
       if(event.ctrlKey===true && event.keyCode==88){
           //your code goes here
       }
    }
//no depedency needs. pretty straight-forward
ui7jx7zq

ui7jx7zq5#

此答案已更新:

看看Keystrokes,它可以让你轻松地绑定快捷方式。它比它的祖先KeyboardJS更小,更容易使用,并且支持React和Vue等主要UI库。

bindKeyCombo('ctrl > x + enter', () => { /*do stuff on press*/ })

// or

bindKeyCombo('ctrl > x + enter', {
    onPressed: () => { /*do stuff on press*/ },
    onReleased: () => { /*do stuff on release*/ }
})

我更新了我的答案,因为十年过去了,建议的库已经成功了。

以下是我十年前的回答:

你可能会发现使用KeyboardJS是一个更好的解决方案。它非常简单易用。

KeyboardJS.on('ctrl + x + enter', function() {
    //do stuff on press
}, function() {
    //do stuff on release
});

另外,如果你想强制在x或enter之前按ctrl键,你也可以这样做

KeyboardJS.on('ctrl > x + enter', function() {
    //do stuff on press
}, function() {
    //do stuff on release
});

相关问题