Rilevazione tasto freccia premere IE tramite javascript/jQuery

Sto provando a impostare un menu che può essere navigato tramite i tasti freccia. Ho questa pinna funzionante in Firefox.Rilevazione tasto freccia premere IE tramite javascript/jQuery

Cercando di farlo funzionare in IE8 e dopo un po 'di difficoltà, ho scoperto che era perché IE8 non registrava un tasto di pressione sulle frecce. A prova:

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

In Firefox, premendo uno dei tasti di direzione sarebbe innescare un allarme di 37, 38, 39 o 40.

in IE8, niente. Qualsiasi altro tasto sulla tastiera QWERTY standard sarebbe registrato, ma non i tasti freccia.

Si tratta di un problema con il mio Javascript? Un'impostazione del browser? Un'impostazione di Windows?

fonte

2010-02-07 DA.

Si prega di non dimenticare di verificare se un utente preme anche il tasto Alt. È un comportamento davvero brutto quando si utilizza e per la navigazione, mentre si impedisce il comportamento predefinito per la navigazione avanti e indietro utilizzando e . –

@Marcel Che cosa fa la navigazione con alt-arrow? Non l'ho mai usato né sembra fare nulla nei browser che sto usando. –

Almeno in Firefox, Chrome e IE (solo un test rapido) equivale a premere il pulsante Indietro, è come premere il pulsante avanti (utilizzo molto spesso questi tasti di scelta rapida). –

Dal jQuery keypress documentation (l'ultimo paragrafo del testo introduttivo):

noti che keydown e keyup fornire un codice che indica quale tasto viene premuto, mentre keypress indica quale carattere immesso. Ad esempio, una "a" minuscola verrà riportata come 65 per keydown e keyup, ma come 97 per keypress. Una "A" maiuscola viene riportata come 97 da tutti gli eventi. A causa di questa distinzione, quando si acquisiscono combinazioni di tasti speciali come i tasti freccia, .keydown() o .keyup() è una scelta migliore.

Esso menziona anche letteralmente sui tasti freccia;) Quindi, si ha realmente bisogno di agganciare su entrambi i keydown o keyup eventi. Ecco uno SSCCE con keydown, basta copiare'n'paste'n'run it. No, non è necessario eseguire un controllo compatibile con browser su event, questo funziona in tutti i browser da IE6 fino a 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>

fonte

2010-02-08 00:04:52 BalusC

+1 per dare una risposta esauriente. -1 per me per non RTFMing. ; o) –

Prego. – BalusC

Per le persone future che hanno questo problema, si noti che si dovrebbe usare l'evento 'keydown' per' $ (document) ', non' $ (window) '(questo è stato un problema a cui mi sono imbattuto). –

utilizzare l'evento 'keydown'

fonte

2010-02-07 17:34:35 psychotik

Prova questo:

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

fonte

2010-02-07 17:39:02 Skilldrick

Il controllo per 'window.event' è necessario con jQuery? Ho capito che ha rimosso la necessità di farlo. –

Perché a volte non voglio eventi a bolla per alcuni tasti, io uso qualcosa di simile: Personalizzare i tasti/codici, come si vedere in forma.

/* 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); 
});

fonte

2010-02-07 23:50:19

Rilevazione tasto freccia premere IE tramite javascript/jQuery

risposta

Problemi correlati