Best cross-browser method to capture CTRL+S with JQuery?

Question

My users would like to be able to hit Control+S to save a form. Is there a good cross-browser way of capturing the Ctrl+S key combination and submit my form?

App is built on Drupal, so jQuery is available.

Answer 1

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

Key codes can differ between browsers, so you may need to check for more than just 115.

Answer 2

You could use a shortcut library to handle the browser specific stuff.

http://www.openjs.com/scripts/events/keyboard_shortcuts/#

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

Answer 3

I would like Web applications to not override my default shortcut keys, honestly. Ctrl-S already does something in browsers. Having that change abruptly depending on the site I'm viewing is disruptive and frustrating, not to mention often buggy -- I've had sites hijack Ctrl-Tab because it looked the same as Ctrl-I, both ruining my work on the site and preventing me from switching tabs as usual.

If you want shortcut keys, use the accesskey attribute. Please don't break existing browser functionality.

Answer 4

@Eevee: As the browser becomes the home for richer and richer functionality and starts to replace desktop apps, it's just not going to be an option to forgo the use of keyboard shortcuts. Gmail's rich and intuitive set of keyboard commands was instrumental in my willingness to abandon Outlook. The keyboard shortcuts in Todoist, Google Reader, and Google Calendar all make my life much, much easier on a daily basis.

Developers should definitely be careful not to override keystrokes that already have a meaning in the browser. For example, the WMD textbox I'm typing into inexplicably interprets Ctrl-Del as "Blockquote" rather than "delete word forward". I'm curious if there's a standard list somewhere of "browser-safe" shortcuts that site developers can use and that browsers will commit to staying away from in future versions.

Answer 5

Cool. thanks for this shortcut key... loved it.

Answer 6

Problem with the shortcut method is that it may interfere with the functioning of screen readers.

Answer 7

I like this little plugin here .. needs a bit more cross browser friendliness though:

http://code.google.com/p/js-hotkeys/

Answer 8

example:

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

usage

link for download: http://www.openjs.com/scripts/events/keyboard_shortcuts/#