Come rilevare la pressione del tasto Esc con JS o jQuery puro?

Possibile duplicato:
quale codice chiave per chiave di escape con jQuery

Come rilevare la chiave di escape premere in IE, Firefox e Chrome? Il codice seguente funziona in IE e avvisi 27, ma in Firefox avvisa0

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

Nota: keyCodesta diventando obsoleto l'uso key, invece.

function keyPress (e) {
    if(e.key === "Escape") {
        // write your logic here.
    }
}

Qui è jsfiddle

keyCode sta diventando deprecato

Sembra keydowne keyupfunziona, anche se keypresspotrebbe non esserlo

$(document).keyup(function(e) {
     if (e.key === "Escape") { // escape key maps to keycode `27`
        // <DO YOUR WORK HERE>
    }
});

Quale codice chiave per chiave di escape con jQuery

L' keydownevento funzionerà perfettamente con Escape e ha il vantaggio di permetterti di utilizzarlo keyCodein tutti i browser. Inoltre, è necessario collegare l'ascoltatore documentpiuttosto che il corpo.

Aggiornamento maggio 2016

keyCodeè ora in procinto di essere deprecato e la maggior parte dei browser moderni offre la keyproprietà ora, anche se per ora avrai ancora bisogno di un fallback per un supporto decente del browser (al momento della stesura delle versioni correnti di Chrome e Safari non lo supportano).

L'aggiornamento settembre 2018 evt.key è ora supportato da tutti i browser moderni.

document.onkeydown = function(evt) {
    evt = evt || window.event;
    var isEscape = false;
    if ("key" in evt) {
        isEscape = (evt.key === "Escape" || evt.key === "Esc");
    } else {
        isEscape = (evt.keyCode === 27);
    }
    if (isEscape) {
        alert("Escape");
    }
};

Click me then press the Escape key

Usando JavaScript puoi controllare jsfiddle funzionante

document.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.keyCode == 27) {
        alert('Esc key pressed.');
    }
};

Usando jQuery puoi controllare jsfiddle funzionante

jQuery(document).on('keyup',function(evt) {
    if (evt.keyCode == 27) {
       alert('Esc key pressed.');
    }
});

controlla keyCode&& which& keyup||keydown

$(document).keydown(function(e){
   var code = e.keyCode || e.which;
   alert(code);
});

Il modo migliore è di far funzionare questo

FUNZIONE:

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

ESEMPIO:

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

Di seguito è riportato il codice che non solo disabilita il tasto ESC, ma controlla anche la condizione in cui viene premuto e, a seconda della situazione, eseguirà o meno l'azione.

In questo esempio,

e.preventDefault();

disabiliterà l'azione di pressione del tasto ESC.

Puoi fare qualcosa di simile a nascondere un div con questo:

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

Se si tiene conto anche del tasto ESC premuto:

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

È possibile rimuovere questa parte se condizione se si desidera applicare a tutto questo. Oppure puoi scegliere come target INPUT qui per applicare questa azione solo quando il cursore si trova nella casella di input.

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

penso che il modo più semplice sia vaniglia javascript:

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