javascript - simular - ¿Cómo detectar la tecla de escape presionando con JS puro o jQuery?

presionar teclas javascript

Question

Posible duplicado:
¿Qué código clave para la tecla de escape con jQuery?

¿Cómo detectar la tecla de escape presionando en IE, Firefox y Chrome? El siguiente código funciona en IE y las alertas 27 , pero en Firefox, alerta 0

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

Answer 1

A continuación se muestra el código que no solo desactiva la tecla ESC, sino que también verifica la condición donde se presiona y, dependiendo de la situación, hará la acción o no.

En este ejemplo,

e.preventDefault();

deshabilitará la tecla ESC pulsando acción.

Puedes hacer algo como ocultar un div con esto:

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

Cuando se presiona la tecla ESC también se toma en consideración:

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

Puede eliminar esto si es parte de la condición si desea aplicar esto a todos. O puede apuntar ENTRADA aquí para aplicar solo esta acción cuando el cursor está en el cuadro de entrada.

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 2

Creo que la forma más sencilla es javascript de vainilla:

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

Answer 3

El evento keydown funcionará bien para Escape y tiene la ventaja de permitirle usar keyCode en todos los navegadores. Además, debe adjuntar el oyente al document lugar del cuerpo.

ACTUALIZACIÓN mayo 2016

keyCode ahora está en proceso de ser desaprobado y la mayoría de los navegadores modernos ofrecen la propiedad key ahora, aunque todavía necesitará un respaldo para un soporte de navegador decente por el momento (al momento de escribir las versiones actuales de Chrome y Safari no lo admite) ).

ACTUALIZACIÓN Septiembre de 2018 key ahora es compatible con todos los navegadores modernos.

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

Answer 4

La mejor manera es hacer funcionar para esto.

FUNCIÓN:

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

EJEMPLO:

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

Answer 5

Nota: keyCode está obteniendo una key uso obsoleta .

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

Aquí está jsfiddle

keyCode está desaprobando

Parece que keydown y keyup funcionan, aunque keypress no puede

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

¿Qué código clave para la tecla de escape con jQuery?

Answer 6

Usando JavaScript puedes hacer chequeo trabajando jsfiddle

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

Usando jQuery puedes hacer chequeo trabajando jsfiddle

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

Answer 7

compruebe keyCode && which & keyup || keydown

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