Detecting Arrow key Drücken Sie in IE über javascript/jQuery

Ich versuche, ein Menü einzurichten, das über die Pfeiltasten navigiert werden kann. Ich habe diese funktionierende Flosse in Firefox.Detecting Arrow key Drücken Sie in IE über javascript/jQuery

Der Versuch, es in IE8 zu arbeiten und nach ein wenig Mühe, fand, dass es war, weil IE8 einen Tastendruck auf den Pfeilen nicht registrieren würde. Zum Test:

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

In Firefox, eine der Pfeiltasten auslösen würde einen Alarm von 37, 38, 39 oder 40.

In IE8, nichts. Jede andere Taste auf der Standard-QWERTZ-Tastatur würde sich registrieren, aber nicht die Pfeiltasten.

Ist das ein Problem mit meinem Javascript? Eine Browsereinstellung? Eine Windows-Einstellung?

Quelle

2010-02-07 DA.

Bitte vergessen Sie nicht zu testen, ob ein Benutzer auch die Alt-Taste drückt. Es ist wirklich schlechtes Verhalten, wenn Sie und für die Navigation verwenden und dabei das Standardverhalten für das Navigieren unter Verwendung von und verhindern. –

@Marcel Was macht die Alt-Pfeil-Navigation? Ich habe es nie benutzt, noch scheint es irgendetwas in den Browsern zu tun, die ich benutze. –

Zumindest in Firefox, Chrome und IE (nur ein schneller Test) ist das gleiche wie das Drücken der Zurück-Taste, ist wie das Drücken der Vorwärts-Taste (ich verwende diese Hotkeys sehr häufig). –

Vom jQuery keypress documentation (der letzte Absatz des einleitenden Text):

Beachten Sie, dass keydown und keyup einen Code liefern, das anzeigt, welche Taste gedrückt wird, während keypress zeigt an, welches Zeichen eingegeben wurde. Zum Beispiel wird ein Kleinbuchstabe "a" als 65 von keydown und keyup, aber als 97 von keypress gemeldet. Ein Großbuchstabe "A" wird von allen Ereignissen als 97 gemeldet. Aufgrund dieser Unterscheidung ist es beim Auffangen spezieller Tastenanschläge wie z. B. Pfeiltasten .keydown() oder .keyup() eine bessere Wahl.

Es gibt sogar wörtlich erwähnt über die Pfeiltasten;) So müssen Sie wirklich auf entweder die keydown oder keyup Ereignisse einzuhaken. Hier ist ein SSCCE mit keydown, nur copy'n'paste'n'run es. Nein, Sie müssen keine browserkompatible Überprüfung der event vornehmen, dies funktioniert in allen Browsern von IE6 bis zu 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>

Quelle

2010-02-08 00:04:52 BalusC

+1 für Sie eine gründliche Antwort geben. -1 für mich für nicht RTFMing. ; o) –

Gern geschehen. – BalusC

Für zukünftige Leute mit diesem Problem, beachten Sie, dass Sie das Ereignis "keydown" für '$ (Dokument)', nicht '$ (Fenster)' verwenden sollten (das war ein Problem, das ich lief). –

Verwenden Sie die ‚keyDown‘ event

Quelle

2010-02-07 17:34:35 psychotik

Versuchen Sie folgendes:

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

Quelle

2010-02-07 17:39:02 Skilldrick

Ist die Überprüfung auf 'window.event' mit jQuery notwendig? Ich habe verstanden, dass es die Notwendigkeit beseitigt hat, das zu tun. –

Weil ich manchmal für einige Schlüssel Ereignisse nicht zu sprudeln will, muss ich etwas verwenden wie: Passen Sie die Codes/Schlüssel, wie Sie siehe fit.

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

Quelle

2010-02-07 23:50:19

Detecting Arrow key Drücken Sie in IE über javascript/jQuery

Antwort

Verwandte Themen