使用JQuery捕获CTRL + S的最佳跨浏览器方法？

Question

我的用户希望能够点击Ctrl+ S来保存表单.是否有一个很好的跨浏览器方式捕获Ctrl+ S组合键并提交我的表单？

应用程序基于Drupal构建,因此jQuery可用.

Answer 1

这适用于我(使用jquery)重载Ctrl+ S,Ctrl+ F和Ctrl+ G:

$(window).bind('keydown', function(event) {
    if (event.ctrlKey || event.metaKey) {
        switch (String.fromCharCode(event.which).toLowerCase()) {
        case 's':
            event.preventDefault();
            alert('ctrl-s');
            break;
        case 'f':
            event.preventDefault();
            alert('ctrl-f');
            break;
        case 'g':
            event.preventDefault();
            alert('ctrl-g');
            break;
        }
    }
});

Answer 2

$(window).keypress(function(event) {
    if (!(event.which == 115 && event.ctrlKey) && !(event.which == 19)) return true;
    alert("Ctrl-S pressed");
    event.preventDefault();
    return false;
});

浏览器的密钥代码可能有所不同,因此您可能需要检查的不仅仅是115.

Answer 3

您可以使用快捷方式库来处理特定于浏览器的内容.

shortcut.add("Ctrl+S",function() {
    alert("Hi there!");
});

Answer 4

这个在Chrome上为我工作...出于某种原因为我event.which返回一个大写字母S(83),不知道为什么(不管大写锁定状态)所以我使用了fromCharCode,toLowerCase只是为了安全起见

$(document).keydown(function(event) {

    //19 for Mac Command+S
    if (!( String.fromCharCode(event.which).toLowerCase() == 's' && event.ctrlKey) && !(event.which == 19)) return true;

    alert("Ctrl-s pressed");

    event.preventDefault();
    return false;
});

如果有人知道为什么我得到83而不是115,我会很高兴听到,如果有人在其他浏览器上测试这个,我会很高兴听到它是否有效

Answer 5

这个jQuery解决方案适用于Chrome和Firefox,适用于Ctrl+ S和Cmd+ S.

$(document).keydown(function(e) {

    var key = undefined;
    var possible = [ e.key, e.keyIdentifier, e.keyCode, e.which ];

    while (key === undefined && possible.length > 0)
    {
        key = possible.pop();
    }

    if (key && (key == '115' || key == '83' ) && (e.ctrlKey || e.metaKey) && !(e.altKey))
    {
        e.preventDefault();
        alert("Ctrl-s pressed");
        return false;
    }
    return true;
}); 

Answer 6

我结合了一些选项来支持FireFox,IE和Chrome.我也更新了它以更好地支持mac

// simply disables save event for chrome
$(window).keypress(function (event) {
    if (!(event.which == 115 && (navigator.platform.match("Mac") ? event.metaKey : event.ctrlKey)) && !(event.which == 19)) return true;
    event.preventDefault();
    return false;
});

// used to process the cmd+s and ctrl+s events
$(document).keydown(function (event) {
     if (event.which == 83 && (navigator.platform.match("Mac") ? event.metaKey : event.ctrlKey)) {
        event.preventDefault();
        save(event);
        return false;
     }
});

Answer 7

老实说,我希望Web应用程序不会覆盖我的默认快捷键. Ctrl+ S已经在浏览器中做了些什么.根据我正在观看的网站突然改变这种情况是破坏性和令人沮丧的,更不用说经常出现问题了.我有网站劫持Ctrl+,Tab因为它看起来和Ctrl+ 相同I,都破坏了我在网站上的工作,并阻止我像往常一样切换标签.

如果需要快捷键,请使用该accesskey属性.请不要破坏现有的浏览器功能.

Answer 8

$(document).keydown(function(e) {
    if ((e.key == 's' || e.key == 'S' ) && (e.ctrlKey || e.metaKey))
    {
        e.preventDefault();
        alert("Ctrl-s pressed");
        return false;
    }
    return true;
}); 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Try pressing ctrl+s somewhere.

这是@AlanBellows 答案的最新版本，替换which为key. 它甚至适用于 Chrome 的大写键故障（如果你按Ctrl+S它发送大写 S 而不是 s）。适用于所有现代浏览器。