JavaScript onkeydown事件入門實(shí)例(鍵盤某個(gè)按鍵被按下)
JavaScript onkeydown 事件
用戶按下一個(gè)鍵盤按鍵時(shí)會觸發(fā) onkeydown 事件。與 onkeypress 事件不同的是,onkeydown 事件是響應(yīng)任意鍵按下的處理(包括功能鍵),onkeypress 事件只響應(yīng)字符鍵按下后的處理。
提示
Internet Explorer/Chrome 瀏覽器使用 event.keyCode 取回被按下的字符,而 Netscape/Firefox/Opera 等瀏覽器使用 event.which。
onkeydown 獲取用戶按下的鍵
下面是一個(gè)利用 onkeydown 事件獲取用戶按下鍵盤按鍵信息的例子:
<html>
<body>
<script type="text/javascript">
function noNumbers(e)
{
var keynum;
var keychar;
keynum = window.event ? e.keyCode : e.which;
keychar = String.fromCharCode(keynum);
alert(keynum+':'+keychar);
}
</script>
<input type="text" onkeydown="return noNumbers(event)" />
</body>
</html>
如上面例子所示,event.keyCode/event.which 得到的是一個(gè)按鍵對應(yīng)的數(shù)字值(Unicode 編碼),常用鍵值對應(yīng)如下:
| 數(shù)字值 | 實(shí)際鍵值 |
|---|---|
| 48到57 | 0到9 |
| 65到90 | a到z(A到Z) |
| 112到135 | F1到F24 |
| 8 | BackSpace(退格) |
| 9 | Tab |
| 13 | Enter(回車) |
| 20 | Caps_Lock(大寫鎖定) |
| 32 | Space(空格鍵) |
| 37 | Left(左箭頭) |
| 38 | Up(上箭頭) |
| 39 | Right(右箭頭) |
| 40 | Down(下箭頭) |
在 Web 應(yīng)用中,常常可以看到利用 onkeydown 事件的 event.keyCode/event.which 來獲取用戶的一些鍵盤操作,從而運(yùn)行某些運(yùn)用的例子。如在用戶登錄時(shí),如果按下了大寫鎖定鍵(20),則加以提示大寫鎖定;在有翻頁的時(shí)候,如果用戶按下左右箭頭,觸發(fā)上下翻頁等。
獲得 Unicode 編碼值之后,如果需要得到實(shí)際對應(yīng)的按鍵值,可以通過 Srting 對象的 fromCharCode 方法(String.fromCharCode())獲得。注意,對于字符獲得的始終是大寫字符,而對于其他一些功能按鍵,得到的字符可能不太易閱讀。
PS:這里再為大家推薦一款關(guān)于JS事件的在線查詢工具,歸納總結(jié)了JS常用的事件類型與函數(shù)功能:
javascript事件與功能說明大全:
相關(guān)文章
javascript學(xué)習(xí)筆記(十八) 獲得頁面中的元素代碼
javascript學(xué)習(xí)筆記之獲得頁面中的元素代碼,需要的朋友可以參考下2012-06-06
Ruffy javascript 學(xué)習(xí)筆記
Ruffy javascript 學(xué)習(xí)筆記2009-11-11
JavaScript中require和import的區(qū)別詳解
本文詳細(xì)講解了JS中require和import的區(qū)別,文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-06-06
JS中創(chuàng)建函數(shù)的三種方式及區(qū)別
這篇文章主要介紹了js函數(shù)的多種定義方法與其區(qū)別,非常的詳細(xì),有需要的小伙伴可以參考下2016-03-03

