Capturando la pulsación de tecla "Eliminar" con jQuery


118

Cuando utilizo el código de ejemplo de la documentación de jQuery para el controlador de eventos de pulsación de tecla, no puedo capturar la Deleteclave. El siguiente fragmento se registrará 0cuando Deletese presione la tecla en FireFox:

$(document).keypress(function(e) {
    console.log(e.which);       
});

Parece que tiene que haber una forma de capturar la Deleteclave, pero es un término ambiguo, por lo que Google no está demostrando ser de mucha ayuda.

Respuestas:


202

No debe usar el keypressevento, sino el evento keyupo keydownporque el keypressevento está destinado a caracteres reales (imprimibles). keydownse maneja en un nivel inferior por lo que capturará todas las claves no imprimibles como deletey enter.


keyupsería hacer mejor el trabajo.
localhoost

2
@atilkan no, el usuario espera comentarios keydown, no keyup. Todos los editores de texto realizan acciones cuando se presiona una tecla, no cuando se suelta.
Philippe Leybaert

1
@PhilippeLeybaert En mi caso, el programa no puede capturar el último carácter pulsado.
localhoost

82
$('html').keyup(function(e){
    if(e.keyCode == 46) {
        alert('Delete key released');
    }
});

Fuente: códigos de clave de javascript char de www.cambiaresearch.com


18
Debería serlo alert('Delete Key Released').
Waldheinz

si alguien usa la pulsación de tecla en lugar de keyup sugerida por Tod, entonces obtendría keycode == 46 event contra. clave (punto). pero funciona bien con keyUp. Gracias
Mubashar

34

Códigos de clave de JavaScript

  • e.keyCode == 8 parabackspace
  • e.keyCode == 46 para forward backspaceo deletebotón en PC

Excepto en este detalle, la respuesta de Colin & Tod está funcionando.


4
Debe ser e.keyCode y no e.KeyCode
Jerome

16

event.key === "Eliminar"

Más reciente y mucho más limpio: uso event.key. ¡No más códigos numéricos arbitrarios!

NOTA: Las propiedades antiguas ( .keyCodey .which) están obsoletas.

document.addEventListener('keydown', function(event) {
    const key = event.key; // const {key} = event; ES6+
    if (key === "Delete") {
        // Do things
    }
});

Documentos de Mozilla

Navegadores compatibles

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.