檢測箭頭鍵在IE瀏覽器通過JavaScript/jQuery

按下我試圖設置一個菜單，可以通過箭頭鍵導航。我在Firefox中有這個工作。檢測箭頭鍵在IE瀏覽器通過JavaScript/jQuery

試圖讓它在IE8中工作並經過一番努力後，發現它是因爲IE8不會在箭頭上註冊按鍵。測試：

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

在Firefox中，按任意的箭頭鍵的將觸發的37，38，39或40

警報在IE8，什麼都沒有。標準QWERTY鍵盤上的任何其他鍵都可以註冊，但不能使用箭頭鍵。

這是我的Javascript的問題？瀏覽器設置？ Windows設置？

來源

2010-02-07 DA.

請不要忘記測試用戶是否也按Alt鍵。當您使用和進行導航時，這是非常糟糕的行爲，同時防止使用和來回瀏覽的默認行爲。 – 2010-02-08 03:00:35

@Marcel alt-arrow導航可以做什麼？我從來沒有使用它，也沒有在我使用的瀏覽器中做任何事情。 – 2010-02-08 15:37:44

至少在Firefox，Chrome和IE中（只是一個快速測試）與按下後退按鈕相同，就像按下前進按鈕（我經常使用這些熱鍵）。 – 2010-02-08 16:58:14

從jQuery keypress documentation（介紹文本的最後一段）：

注意和keyup提供指示按下其中的按鍵的代碼，而keypress表示被輸入的字符。例如，小寫字母「a」將被報告爲和keyup 65，但是被keypress報告爲97。大寫字母「A」在所有事件中報告爲97。由於這種區別，當捕捉特殊擊鍵（如箭頭鍵）時，.keydown()或.keyup()是更好的選擇。

它甚至從字面上提到關於箭頭鍵;）這樣，你真的需要勾上無論是或keyup事件。這是SSCCE與，只是copy'n'paste'n'run它。不，您不需要在event上進行瀏覽器兼容檢查，這適用於從IE6到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>

來源

2010-02-08 00:04:52 BalusC

+1給你一個徹底的答案。 -1對我來說不是RTFMing。 ; o） – 2010-02-08 15:36:57

不客氣。 – BalusC 2010-02-08 15:41:59

對於有此問題的未來人員，請注意，您應該對'$（document）'使用'keydown'事件，而不是'$（window）'（這是我碰到的一個問題）。 – 2012-05-30 13:25:17

使用「的keydown」事件

來源

2010-02-07 17:34:35 psychotik

試試這個：

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

來源

2010-02-07 17:39:02 Skilldrick

是否需要使用jQuery檢查'window.event'？我明白它沒有必要這樣做。 – 2010-02-07 23:36:08

因爲我有時不想事件給泡了一些按鍵，我使用類似：自定義代碼/密鑰爲你覺得合適。

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

來源

2010-02-07 23:50:19

檢測箭頭鍵在IE瀏覽器通過JavaScript/jQuery

回答

相關問題