Лучший кросс-браузерный метод для захвата CTRL + S с JQuery?

Мои пользователи хотели бы иметь возможность нажать Ctrl+, Sчтобы сохранить форму. Есть ли хороший кросс-браузерный способ захвата комбинации клавиш Ctrl+ Sи отправки моей формы?

Приложение построено на Drupal, поэтому jQuery доступен.

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

Коды клавиш могут отличаться в разных браузерах, поэтому вам может потребоваться проверить не только 115.

Это работает для меня (используя 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;
        }
    }
});

Вы можете использовать библиотеку ярлыков для обработки специфических для браузера вещей.

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

Это решение 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;
}); 

Этот работал для меня на 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 , я буду рад услышать, а также, если кто-нибудь протестирует это в других браузерах, я буду рад услышать, работает ли он или нет

Я объединил несколько вариантов поддержки 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;
     }
});

Честно говоря, я бы хотел, чтобы веб-приложения не переопределяли мои стандартные сочетания клавиш. Ctrl+ Sуже что-то делает в браузерах. Это внезапное изменение в зависимости от сайта, который я просматриваю, разрушительно и разочаровывает, не говоря уже о том, что оно часто глючит. У меня был угон сайтов Ctrl+, Tabпотому что он выглядел так же, как Ctrl+ I, что разрушало мою работу на сайте и мешало мне переключать вкладки как обычно.

Если вы хотите сочетания клавиш, используйте accesskeyатрибут. Пожалуйста, не нарушайте существующие функции браузера.

@Eevee: Поскольку браузер становится домом для все более и более функциональных функций и начинает заменять настольные приложения, он просто не будет возможностью отказаться от использования сочетаний клавиш. Богатый и интуитивно понятный набор клавиатурных команд Gmail способствовал моей готовности отказаться от Outlook. Сочетания клавиш в Todoist, Google Reader и Google Calendar - все это делает мою жизнь намного проще в повседневной жизни.

Разработчики должны определенно быть осторожными, чтобы не отменять нажатия клавиш, которые уже имеют значение в браузере. Например, текстовое поле для оружия массового поражения, которое я печатаю необъяснимым образом, интерпретирует Ctrl+ Delкак «Blockquote», а не «удалить слово вперед». Мне любопытно, есть ли где-нибудь стандартный список «безопасных для браузера» ярлыков, которые разработчики сайтов могут использовать, и которые браузеры обязуются избегать в будущих версиях.

$(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). Работает во всех современных браузерах.

Это было моё решение, которое намного легче читать, чем другие предложения, может легко включать другие комбинации клавиш и было протестировано на IE, Chrome и Firefox:

$(window).keydown(function(evt) {
    var key = String.fromCharCode(evt.keyCode);
    //ctrl+s
    if (key.toLowerCase() === "s" && evt.ctrlKey) {
        fnToRun();
        evt.preventDefault(true);
        return false;
    }
    return true;
});

Мне нравится этот маленький плагин . Это требует немного больше кроссбраузерности, хотя.

Это должно работать (адаптировано с https://stackoverflow.com/a/8285722/388902 ).

var ctrl_down = false;
var ctrl_key = 17;
var s_key = 83;

$(document).keydown(function(e) {
    if (e.keyCode == ctrl_key) ctrl_down = true;
}).keyup(function(e) {
    if (e.keyCode == ctrl_key) ctrl_down = false;
});

$(document).keydown(function(e) {
    if (ctrl_down && (e.keyCode == s_key)) {
        alert('Ctrl-s pressed');
        // Your code
        return false;
    }
}); 

пример:

shortcut.add("Ctrl+c",function() {
    alert('Ok...');
}
,{
    'type':'keydown',
    'propagate':false,
    'target':document
});

использование

<script type="text/javascript" src="js/shortcut.js"></script>

ссылка для скачивания: http://www.openjs.com/scripts/events/keyboard_shortcuts/#

На вопрос Alan Bellows:! (E.altKey) добавлено для пользователей, которые используют AltGrпри наборе текста (например, Польша). Без этого нажатие AltGr+ Sдаст тот же результат, что и Ctrl+S

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

Этот плагин, сделанный мной, может быть полезным.

Plugin

Вы можете использовать этот плагин, который вы должны предоставить ключевые коды и функции для запуска, как это

simulatorControl([17,83], function(){
 console.log('You have pressed Ctrl+Z');
});

В коде я показал, как выполнить для Ctrl+ S. По ссылке вы получите подробную документацию. Плагин находится в разделе JavaScript Code of My Pen на Codepen.

Я решил свою проблему в IE , используя alert("With a message")для предотвращения поведения по умолчанию:

window.addEventListener("keydown", function (e) {
    if(e.ctrlKey || e.metaKey){
        e.preventDefault(); //Good browsers
        if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) { //hack for ie
            alert("Please, use the print button located on the top bar");
            return;
        }
    }
});