Wie zu erkennen Escape-Taste drücken mit reinen JS oder jQuery?

Question

Mögliches Duplikat:
Welcher Keycode für die Escape-Taste mit jQuery

Wie erkennt man das Drücken der Escape-Taste in IE, Firefox und Chrome? Der folgende Code funktioniert im IE und in Warnmeldungen 27 aber in Firefox wird Folgendes angezeigt 0

$('body').keypress(function(e){
    alert(e.which);
    if(e.which == 27){
        // Close my modal window
    }
});

Answer 1

Reines JS (kein JQuery)

document.addEventListener('keydown', function(e) {
    if(e.keyCode == 27){
      //add your code here
    }
});

Answer 2

Im Folgenden finden Sie den Code, der nicht nur die ESC-Taste deaktiviert, sondern auch die Bedingung prüft, unter der sie gedrückt wird, und je nach Situation die Aktion ausführt oder nicht.

In diesem Beispiel,

e.preventDefault();

deaktiviert den ESC-Tastendruck.

Sie können damit z.B. ein Div verstecken:

document.getElementById('myDivId').style.display = 'none';

Es wird auch berücksichtigt, wo die ESC-Taste gedrückt wurde:

(e.target.nodeName=='BODY')

Sie können diesen Teil der Bedingung entfernen, wenn Sie dies auf alle anwenden möchten. Oder Sie können hier auf INPUT abzielen, um diese Aktion nur anzuwenden, wenn sich der Cursor im Eingabefeld befindet.

window.addEventListener('keydown', function(e){
    if((e.key=='Escape'||e.key=='Esc'||e.keyCode==27) && (e.target.nodeName=='BODY')){
        e.preventDefault();
        return false;
    }
}, true);

Answer 3

Am besten ist es, dafür eine Funktion zu erstellen

FUNKTION:

$.fn.escape = function (callback) {
    return this.each(function () {
        $(document).on("keydown", this, function (e) {
            var keycode = ((typeof e.keyCode !='undefined' && e.keyCode) ? e.keyCode : e.which);
            if (keycode === 27) {
                callback.call(this, e);
            };
        });
    });
};

BEISPIEL:

$("#my-div").escape(function () {
    alert('Escape!');
})

Answer 4

Ich denke, der einfachste Weg ist Vanilla-Javascript:

document.onkeyup = function(event) {
   if (event.keyCode === 27){
     //do something here
   }
}

Aktualisiert: Geänderter Schlüssel => keyCode

Answer 5

Bei Firefox 78 verwenden Sie dies ("keypress" funktioniert nicht für die Escape-Taste):

function keyPress (e)(){
  if (e.key == "Escape"){
     //do something here      
  }
document.addEventListener("keyup", keyPress);