Wie erfasst man einen Tastendruck, z. B. Strg + Z, ohne ein Eingabeelement in JavaScript auf der Seite zu platzieren? Im IE können Tastendruck- und Tastendruckereignisse nur an Eingabeelemente (Eingabefelder, Textbereiche usw.) gebunden werden.

jQuery hat auch eine hervorragende Implementierung, die unglaublich einfach zu bedienen ist. So können Sie diese Funktionalität in allen Browsern implementieren:

$(document).keypress(function(e){
    var checkWebkitandIE=(e.which==26 ? 1 : 0);
    var checkMoz=(e.which==122 && e.ctrlKey ? 1 : 0);

    if (checkWebkitandIE || checkMoz) $("body").append("<p>ctrl+z detected!</p>");
});

Getestet in IE7, Firefox 3.6.3 und Chrome 4.1.249.1064

Eine andere Möglichkeit besteht darin, das Keydown-Ereignis zu verwenden und den event.keyCode zu verfolgen. Da jQuery jedoch keyCode und charCode mithilfe von event.which normalisiert, empfiehlt die Spezifikation die Verwendung von event.which in verschiedenen Situationen:

$(document).keydown(function(e){
if (e.keyCode==90 && e.ctrlKey)
    $("body").append("<p>ctrl+z detected!</p>");
});

Bei nicht druckbaren Tasten wie Pfeiltasten und Tastenkombinationen wie Strg-z, Strg-x, Strg-c, die möglicherweise eine Aktion im Browser auslösen (z. B. in bearbeitbaren Dokumenten oder Elementen), wird möglicherweise kein Tastendruck angezeigt Ereignis in allen Browsern. Aus diesem Grund müssen Sie keydownstattdessen verwenden, wenn Sie die Standardaktion des Browsers unterdrücken möchten. Wenn nicht, keyupwird es genauso gut tun.

Anhängen eines keydownEreignisses an documentalle gängigen Browser:

document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.ctrlKey && evt.keyCode == 90) {
        alert("Ctrl-Z");
    }
};

Als vollständige Referenz empfehle ich dringend Jan Wolters Artikel über die Handhabung von JavaScript-Schlüsseln .

Tastendruck erkennen, einschließlich Tastenkombinationen:

window.addEventListener('keydown', function (e) {
  if (e.ctrlKey && e.keyCode == 90) {
    // Ctrl + z pressed
  }
});

Vorteil hierbei ist , dass Sie nicht überschreiben alle globalen Eigenschaften, sondern lediglich eine Nebenwirkung einzuführen. Nicht gut, aber definitiv viel weniger schändlich als andere Vorschläge hier.

Verwenden event.keySie für moderne JS !

document.addEventListener("keypress", function onPress(event) {
    if (event.key === "z" && event.ctrlKey) {
        // Do something awesome
    }
});

HINWEIS: Die alten Eigenschaften ( .keyCodeund .which) sind veraltet.

Mozilla Docs

Unterstützte Browser

Code & erkennt Strg + z

document.onkeyup = function(e) {
  if(e.ctrlKey && e.keyCode == 90) {
    // ctrl+z pressed
  }
}