javascript - ejemplos - jQuery Keypress Arrow Keys

keypress jquery ejemplos

Question

Estoy intentando capturar las teclas de flecha presionadas en jQuery, pero no se están desencadenando eventos.

$(function(){
    $(''html'').keypress(function(e){
        console.log(e);
    });
});

Esto genera eventos para las teclas alfanuméricas, pero eliminar, las teclas de flecha, etc. no generan ningún evento.

¿Qué estoy haciendo mal para no capturarlos?

Answer 1

Aquí hay un ejemplo: JSnippet DEMO keydown () vs keypress ()

Debería usar .keydown() porque .keypress() ignorará "Flechas", para capturar el tipo de tecla use e.which

Presione la pantalla de resultados para enfocar (abajo a la derecha en la pantalla de violín) y luego presione las teclas de flecha para ver cómo funciona.

Notas:

1. .keypress() nunca se disparará con Shift, Esc y Delete pero .keydown() hará.
2. En realidad, .keypress() en algún navegador se disparará con las teclas de flecha, pero no es un navegador cruzado, por lo que es más confiable utilizar .keydown() .

Más información útil

3. Puede usar .keyCode o .keyCode del objeto de evento: algunos navegadores no son compatibles con uno de ellos, pero cuando usa jQuery es seguro usar los dos ya que jQuery lo estandariza. (Prefiero .which nunca tuvo un problema con).
4. Para detectar un ctrl | alt | shift | META ctrl | alt | shift | META ctrl | alt | shift | META presione con la tecla capturada real, debe verificar las siguientes propiedades del objeto de evento: se establecerán en TRUE si se presionaron:
   • event.ctrlKey - ctrl
   • event.altKey - alt
   • event.shiftKey - shift
   • event.metaKey - META ( Comando ⌘ O tecla de Windows )

5. Finalmente, aquí hay algunos códigos clave útiles (para obtener una lista completa, keycode-cheatsheet ):

   • Ingrese: 13
   • Up: 38
   • Abajo: 40
   • Derecha: 39
   • Izquierda: 37
   • Esc: 27
   • Barra espaciadora: 32
   • Ctrl: 17
   • Alt: 18
   • Turno: 16

Answer 2

Por favor, consulte el enlace de JQuery

api.jquery.com/keypress

Dice

El evento de pulsación de tecla se envía a un elemento cuando el navegador registra la entrada del teclado. Esto es similar al evento keydown, excepto que las teclas modificadoras y no imprimibles, como Mayús, Esc y Eliminar eventos de pulsación de disparo, pero no eventos de pulsación de tecla. Pueden surgir otras diferencias entre los dos eventos según la plataforma y el navegador.

Eso significa que no puede usar la tecla presionar en caso de flechas.

Answer 3

Puede verificar si una tecla de flecha está presionada por:

$(document).keydown(function(e){
    if (e.keyCode > 36 && e.keyCode < 41) 
      alert( "arrowkey pressed" );          
});

jsfiddle demo

Answer 4

$(document).keydown(function(e) {
    console.log(e.keyCode);
});

Los eventos de pulsación de tecla detectan teclas de flecha, pero no en todos los navegadores. Por lo tanto, es mejor usar la tecla de configuración.

Estos son los códigos clave que debería obtener en el registro de la consola:

• izquierda = 37
• up = 38
• derecha = 39
• abajo = 40

Answer 5

$(document).on( "keydown",  keyPressed);

function keyPressed (e){
    e = e || window.e;
    var newchar = e.which || e.keyCode;
    alert(newchar)
}

Answer 6

left = 37,up = 38, right = 39,down = 40

$(document).keydown(function(e) {
switch(e.which) {
    case 37:
    $( "#prev" ).click();
    break;

    case 38:
    $( "#prev" ).click();
    break;

    case 39:
    $( "#next" ).click();
    break;

    case 40:
    $( "#next" ).click();
    break;

    default: return;
}
e.preventDefault();

});