js監(jiān)聽鍵盤事件的方法_原生和jquery的區(qū)別詳解
更新時間：2016年10月10日 09:17:21 投稿：jingxian
下面小編就為大家?guī)硪黄猨s監(jiān)聽鍵盤事件的方法_原生和jquery的區(qū)別詳解。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
經常需要監(jiān)聽鍵盤的事件，以便做更好的操作，基本原理是：監(jiān)聽全局鍵盤，每一個鍵盤，當用戶按下某一按鍵時，返回對應的鍵值，然后再判斷用戶按下了哪一科按鍵，鍵值對應按鍵的名稱在最下面列出，自行比對。去以下介紹兩種不同的方式
原生鍵盤監(jiān)聽事件：按下一次按鍵，分為三個過程，按下—按住—松開
onkeydown：某個鍵被按下
onkeypress：某個鍵盤的鍵被按下或按住
onkeyup：某個鍵盤的鍵被松開
使用方法，一般來說，鍵盤監(jiān)聽是直接在整個頁面文檔上進行監(jiān)聽的，也就是document上
以下是原生的使用案例
//實際使用
document.onkeydown=function(e){ //對整個頁面文檔監(jiān)聽
var keyNum=window.event ? e.keyCode :e.which; //獲取被按下的鍵值
//判斷如果用戶按下了回車鍵（keycody=13）
if(keyNum==13){
alert('您按下了回車');
}
//判斷如果用戶按下了空格鍵(keycode=32)，
if(keyNum==32){
alert('您按下了空格');
}
剩下另外兩個按鍵方法同理
jquery的方式監(jiān)聽鍵盤事件
jquery的也分為三個過程，但是在事件名稱上有所不同
keyup：某個鍵盤的鍵被松開
keydown：某個鍵被按下
keypress：某個鍵盤的鍵被按下或按住
使用方法：
$(document).keyup(function(event){
switch(event.keyCode) {
case 27:
alert('您按下了回車');
return;
case 13:
alert('您按下了空格');
return;
}
});
小總結：總體來說，這兩種方式達到的效果都是一樣的，只是由于jquery的獲取對象更加簡單，所以一般更推介使用jquery，當然，如果你有jquery基礎的話。
以上就是小編為大家?guī)淼膉s監(jiān)聽鍵盤事件的方法_原生和jquery的區(qū)別詳解全部內容了，希望大家多多支持腳本之家~
相關文章
javascript實現的字符串與十六進制表示字符串相互轉換方法
這篇文章主要介紹了javascript實現的字符串與十六進制表示字符串相互轉換方法,涉及javascript字符串轉換的相關技巧,在防止SQL注入和XSS中具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07
下面小編就為大家?guī)硪黄猨s每隔兩秒輸出數組中的一項(實例)。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-05-05
最近在修改百度地圖開源的東西,想把里面耦合在一起的代碼給拆分出來,拆解之后,發(fā)現了一些問題,邏輯上沒有問題的情況下,該出現的效果沒有出現2013-03-03
本文主要介紹了JavaScript中Array.from()的用法總結2023-05-05
右下角彈出提示框想必大家不會陌生吧，本文簡單的為大家實現一個，具體代碼如下，有需求的朋友可以參考下2013-08-08
這篇文章主要介紹了js過濾HTML標簽實現方法,以完整實例形式分析了JavaScript使用正則表達式過濾HTML標簽的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-11-11
這篇文章主要為大家詳細介紹了微信小程序實現點贊業(yè)務，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-02-02
這篇文章主要為大家詳細介紹了js canvas實現二維碼和圖片合成的海報，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-11-11
本篇文章主要介紹了解決bootstrap下拉菜單點擊立即隱藏bug的方法，具有一定的參考價值，有興趣的可以了解一下2017-06-06
深入理解Javascript中的循環(huán)優(yōu)化
這篇文章介紹了Javascript中的循環(huán)優(yōu)化，有需要的朋友可以參考一下2013-11-11