js監聽組合按鍵


前言

我們經常用到組合鍵,例如alt+f4,crtl+enter。在開發中也會有這種需求。

組合鍵類型

單獨組合,二鍵組合,三鍵組合

思路

1、獲取鍵盤上的按鍵

2、阻止瀏覽器上的默認行為

3、執行自定義的js函數

代碼例子

        document.onkeydown = function(e) { var keyCode = e.keyCode || e.which || e.charCode; var altKey = e.altKey ; if(altKey && keyCode == 112) { alert("組合鍵成功") } e.preventDefault(); return false; }

解刨

e.keyCode || e.which || e.charCode

谷歌瀏覽器對event.keyCode,event.charCode和event.which都兼容。

火狐瀏覽器對event.keyCode部分鍵值有效,如上下左右鍵(37,38,39,40),enter鍵(13),PgUp(33),PgDn(34)等部分有效,對數字鍵,字母鍵無效。

event.which也是部分鍵值有效,如字母鍵,數字鍵,enter鍵,Backspace鍵等有效,對上下左右鍵,PgUp(33),PgDn(34)鍵無效。

event.charCode也是對部分鍵值有效,如字母鍵,數字鍵,,Backspace鍵等有效,對enter鍵,上下左右鍵,PgUp(33),PgDn(34)鍵無效。

ie瀏覽器中,IE8及以下瀏覽器對event.charCode無效,event.keyCode和event.which對大部分鍵值能獲得,但是有少部分也不能獲得。

所以該寫法為兼容寫法。

e.altKey,e.shiftKey,e.ctrlKey,e.metaKey

用來監聽鍵盤上的alt,shift,ctrl,meta鍵。當按下這些鍵的時候,值會變為true。

e.preventDefault()

阻止默認事件,在W3C標准和IE下,處理方式不太一致。分別是執行e.preventDefault()方法和將e.returnValue = false屬性。當然如果你使用的jquery等類庫的話,只需要寫一個e.preventDefault()就可以了,它幫你做到了兼容。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM