Detectando la tecla de flecha presione IE a través de javascript/jQuery

Estoy tratando de configurar un menú que se puede navegar mediante las teclas de flecha. Tengo esta aleta que funciona en Firefox.Detectando la tecla de flecha presione IE a través de javascript/jQuery

Tratando de que funcione en IE8 y después de un poco de lucha, descubrí que era porque IE8 no registraría una pulsación de tecla en las flechas. Para probar:

$(document).keypress(function (eh){ 
    alert(eh.keyCode); 
};

En Firefox, pulsar cualquiera de las teclas de flecha daría lugar a una alerta de 37, 38, 39 o 40.

En IE8, nada. Cualquier otra tecla en el teclado QWERTY estándar se registraría, pero no las teclas de flecha.

¿Este es un problema con mi Javascript? Una configuración de navegador? Una configuración de Windows?

Fuente

2010-02-07 DA.

No olvide probar si un usuario también presiona la tecla Alt. Es realmente un mal comportamiento cuando usa y para la navegación mientras evita el comportamiento predeterminado para navegar de ida y vuelta usando y . –

@Marcel ¿Qué hace la navegación alt-arrow? Nunca lo he usado ni parece hacer nada en los navegadores que estoy usando. –

Al menos en Firefox, Chrome e IE (solo una prueba rápida) es lo mismo que presionar el botón Atrás, es como presionar el botón de reenviar (con mucha frecuencia uso estas teclas rápidas). –

Desde el jQuery keypress documentation (el último párrafo del texto introductorio):

Tenga en cuenta que keydown y keyup proporcionan un código que indica qué tecla se pulsa, mientras keypress indica que el personaje se ha especificado. Por ejemplo, una "a" minúscula será reportada como 65 por keydown y keyup, pero como 97 por keypress. Una mayúscula "A" se informa como 97 por todos los eventos. Debido a esta distinción, cuando se capturan teclas especiales como las teclas de flecha, .keydown() o .keyup() es una mejor opción.

Incluso literalmente menciona acerca de las teclas de flecha;) Por lo tanto, que realmente necesita para conectar en cualquiera de las keydown o keyup eventos. Aquí hay un SSCCE con keydown, solo copie y pase. No, no necesita hacer una verificación compatible con el navegador en el event, esto funciona en todos los navegadores desde IE6 hasta Firefox.

<!doctype html> 
<html lang="en"> 
    <head> 
     <title>SO question 2217553</title> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
     <script> 
      $(document).keydown(function(event) { 
       switch (event.keyCode) { 
        case 37: alert('left'); break; 
        case 38: alert('up'); break; 
        case 39: alert('right'); break; 
        case 40: alert('down'); break; 
       } 
      }); 
     </script> 
    </head> 
    <body> 
     <p>Press one of the arrow keys.</p> 
    </body> 
</html>

Fuente

2010-02-08 00:04:52 BalusC

+1 para usted dando una respuesta completa. -1 para mí por no RTFMing. ; o) –

De nada. – BalusC

Para las personas que tengan este problema en el futuro, tenga en cuenta que debe usar el evento 'keydown' para' $ (documento) ', no' $ (ventana) '(este fue un problema con el que me encontré). –

utilizar el evento 'keyDown'

Fuente

2010-02-07 17:34:35 psychotik

Prueba esto:

$(document).keydown(function (e) { 
    if(!e) { 
     e = window.event; 
    } 
    switch(e.keyCode) { 
    case 37: 
     goLeft(); 
     break; 
    case 39: 
     goRight(); 
     break; 
    } 
});

Fuente

2010-02-07 17:39:02 Skilldrick

¿Es necesario el control de 'window.event' con jQuery? Entendí que eliminó la necesidad de hacer eso. –

porque a veces no quiero eventos y las burbujas de algunas teclas, utilizo algo como: Personalizar los códigos/llaves a medida que consideran necesario.

/* handle special key press */ 
function checkCptKey(e) 
{ 
    var shouldBubble = true; 
    switch (e.keyCode) 
    { 
     // user pressed the Tab                                   
     case 9: 
      { 
       $(".someSelect").toggleClass("classSelectVisible"); 
       shouldBubble = false; 
       break; 
      }; 
      // user pressed the Enter  
     case 13: 
      { 
       $(".someSelect").toggleClass("classSelectVisible"); 
       break; 
      }; 
      // user pressed the ESC 
     case 27: 
      { 
       $(".someSelect").toggleClass("classSelectVisible"); 
       break; 
      }; 
    }; 
    /* this propogates the jQuery event if true */ 
    return shouldBubble; 
}; 

/* user pressed special keys while in Selector */ 
$(".mySelect").keydown(function(e) 
{ 
    return checkCptKey(e); 
});

Fuente

2010-02-07 23:50:19

Detectando la tecla de flecha presione IE a través de javascript/jQuery

Respuesta

Cuestiones relacionadas