Beste browserübergreifende Methode zum Erfassen von STRG + S mit JQuery?

Meine Benutzer möchten in der Lage sein, Ctrl+ Szu drücken, um ein Formular zu speichern. Gibt es eine gute browserübergreifende Möglichkeit, die Ctrl+ STastenkombination zu erfassen und mein Formular zu senden?

Die App basiert auf Drupal, sodass jQuery verfügbar ist.

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

Die Schlüsselcodes können zwischen den Browsern unterschiedlich sein, daher müssen Sie möglicherweise nach mehr als nur 115 suchen.

Dies funktioniert bei mir (mit jquery), um Ctrl+ S, Ctrl+ Fund Ctrl+ zu überladen 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;
        }
    }
});

Sie können eine Verknüpfungsbibliothek verwenden , um die browserspezifischen Aufgaben zu erledigen.

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

Diese jQuery-Lösung funktioniert für mich in Chrome und Firefox sowohl für Ctrl+ Sals auch für 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;
}); 

Dieser hat für mich auf Chrome funktioniert ... aus irgendeinem Grund event.whichgibt er ein Großbuchstaben S (83) für mich zurück, nicht sicher warum (unabhängig vom Status der Feststelltaste), also habe ich verwendet fromCharCodeund toLowerCasenur um auf der sicheren Seite zu sein

$(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;
});

Wenn jemand weiß, warum ich 83 und nicht 115 bekomme , werde ich mich freuen zu hören, auch wenn jemand dies in anderen Browsern testet, werde ich mich freuen zu hören, ob es funktioniert oder nicht

Ich habe einige Optionen kombiniert, um FireFox, IE und Chrome zu unterstützen. Ich habe es auch aktualisiert, um Mac besser zu unterstützen

// 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;
     }
});

Ich möchte, dass Webanwendungen ehrlich gesagt meine Standard-Tastenkombinationen nicht überschreiben. Ctrl+ macht Sschon etwas in Browsern. Diese Änderung abrupt abhängig von der Site, die ich gerade ansehe, ist störend und frustrierend, ganz zu schweigen von den oft fehlerhaften. Ich habe Websites entführt, Ctrl+ Tabweil sie genauso aussahen wie Ctrl+ I, was sowohl meine Arbeit auf der Website ruinierte als auch mich daran hinderte, die Tabs wie gewohnt zu wechseln.

Wenn Sie Tastenkombinationen möchten, verwenden Sie das accesskeyAttribut. Bitte brechen Sie nicht die vorhandenen Browserfunktionen.

@Eevee: Da der Browser die Heimat für immer umfangreichere Funktionen wird und Desktop-Apps ersetzt, ist es einfach keine Option, auf die Verwendung von Tastaturkürzeln zu verzichten. Die umfangreichen und intuitiven Tastaturbefehle von Google Mail trugen maßgeblich zu meiner Bereitschaft bei, Outlook aufzugeben. Die Tastaturkürzel in Todoist, Google Reader und Google Kalender erleichtern mir das tägliche Leben erheblich.

Entwickler sollten auf jeden Fall darauf achten, Tastenanschläge, die bereits eine Bedeutung im Browser haben, nicht zu überschreiben. Zum Beispiel interpretiert das WMD-Textfeld, in das ich unerklärlicherweise tippe, Ctrl+ Delals "Blockquote" anstatt als "Wort vorwärts löschen". Ich bin gespannt, ob es irgendwo eine Standardliste mit "browser-sicheren" Verknüpfungen gibt, die Website-Entwickler verwenden können und von denen sich Browser verpflichten, sich in zukünftigen Versionen fernzuhalten.

$(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.

Dies ist eine aktuelle Version der Antwort von @ AlanBellows, die whichdurch ersetzt wird key. Es funktioniert auch mit Chrome's Großbuchstabenfehler (wenn Sie Ctrl+ drücken S, wird Großbuchstaben S anstelle von s gesendet). Funktioniert in allen modernen Browsern.

Dies war meine Lösung, die viel einfacher zu lesen ist als andere Vorschläge hier, leicht andere Tastenkombinationen enthalten kann und auf IE, Chrome und Firefox getestet wurde:

$(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;
});

Ich mag dieses kleine Plugin . Es braucht allerdings etwas mehr Cross-Browser-Freundlichkeit.

Dies sollte funktionieren (angepasst von 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;
    }
}); 

Beispiel:

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

Verwendung

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

Link zum Download: http://www.openjs.com/scripts/events/keyboard_shortcuts/#

Zu Alan Bellows Antwort :! (E.altKey) hinzugefügt für Benutzer, die AltGrbeim Tippen verwenden (z. B. Polen). Ohne dieses Drücken von AltGr+ erhalten Sie Sdas gleiche Ergebnis wie 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; });

Dieses von mir erstellte Plugin kann hilfreich sein.

Plugin

Mit diesem Plugin müssen Sie die Schlüsselcodes und Funktionen angeben, um so ausgeführt zu werden

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

Im Code habe ich gezeigt, wie man für Ctrl+ arbeitet S. Sie erhalten eine detaillierte Dokumentation über den Link. Das Plugin befindet sich im JavaScript-Code-Bereich meines Stifts auf Codepen.

Ich habe mein Problem im IE gelöst , indem ich ein verwendet habe alert("With a message"), um das Standardverhalten zu verhindern:

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;
        }
    }
});