JavaScript和JQuery中的按鍵事件？

我自己製作一個HTML幻燈片，並且能夠創建大部分的東西。我卡住的地方是鍵盤事件。這是前進和後退箭頭。我需要知道如何使用JavaScript或JQuery來處理這些問題。按下這些按鈕將觸發事件，以便移動到下一張幻燈片或轉到上一張幻燈片。我還想提一下，我的幻燈片也是交互式HTML，因爲您可以使用它們填寫數據，驗證等。所以我不希望鍵盤事件妨礙用戶通過鍵盤與頁面上的表單或其他內容進行交互（例如填寫表單，日期等）。如何解決這個問題？JavaScript和JQuery中的按鍵事件？

來源

2011-12-17 Shiv Kumar Ganesh

什麼是你需要知道以後使用['.keypress（）'jQuery的方法（http://api.jquery.com/keypress/）？ – jfriend00 2011-12-17 18:44:55

有用於處理鍵盤輸入3個不同的事件：KEYUP，KeyDown和按鍵。不是所有的按鍵都被觸發，有些按照操作系統觸發不同的代碼。查看quirksmode瞭解更多信息。

jQuery對每個事件都有相應的事件。

jQuery site來自：

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

爲了避免操作時用戶與形式交互這些事件，你可能想打開關閉的行爲隨時表單域具有焦點，並把它回來時，表單字段是模糊的。這樣，使用這些箭頭來導航輸入字段將不會導致幻燈片遍歷。

來源

2011-12-17 18:48:41 danludwig

非常感謝Help.I訣竅。 – 2011-12-17 19:27:17

$(window).keypress(function(e) { 
    var keyCode = e.keyCode || e.which; //browser compatible 
    switch (keyCode) { 
     case 39: 
      alert("right key pressed"); 
      break; 
     case 37: 
      alert("left key pressed"); 
      break; 
     default: 
      alert("other key pressed"); 
    } 
});

小提琴：http://jsfiddle.net/3wdw7/

來源

2011-12-17 18:46:18

嗨...我嘗試了小提琴，但我的左右鍵，你的意思是箭頭鍵......他們叮叮噹噹地工作。其他鍵是working.My soncern是，如果我在頁面中有一個文本框，我可以輸入它，那麼這段代碼不應該工作。當我離開文本框，這應該開始工作了http://jsfiddle.net/shivkumarganesh/HgDAD/我有一個文本框，我想打字沒有障礙。因爲我出它的腳本應該運行 – 2011-12-17 19:12:21

你會想在這裏使用'keydown'而不是'keypress'，因爲我們的目標是抓住方向鍵。查看兩者之間的區別：http://www.quirksmode.org/dom/events/keys.html – Leo 2011-12-17 19:28:48

jQuery [normalize'event.which']（http://api.jquery.com/keydown/） - 你可以使用它。 – s4y 2011-12-17 19:45:44

我會做這樣的事情：

$(window).keydown(function(e) { 
    if (e.target !== document.body) return; 
    switch (e.keyCode) { 
    case 39: 
     alert("right"); 
     e.preventDefault(); 
     break; 
    case 37: 
     alert("left"); 
     e.preventDefault(); 
     break; 
    } 
});

您可以檢查事件的目標忽略的子元素如文本字段關鍵事件，你可能應該防止對事件停止瀏覽器的默認從執行其默認操作，如滾動頁面。

http://jsfiddle.net/3wdw7/2/

來源

2011-12-17 19:33:56 s4y

JavaScript和JQuery中的按鍵事件？

回答

相關問題