Javascript 檢測鍵盤按鍵信息及鍵碼值對應(yīng)介紹
更新時(shí)間:2013年01月03日 16:18:59 作者:
Javascript中有3個(gè)事件句柄在對應(yīng)鍵盤的輸入狀態(tài):按鍵被按下(按下按鍵但還沒有抬起)、點(diǎn)擊按鍵(按下并抬起按鍵)、按鍵抬起(按鍵抬起之后),接下來詳細(xì)介紹,感興趣的朋友可以了解下
Javascript中有3個(gè)事件句柄在對應(yīng)鍵盤的輸入狀態(tài):keydown、keypress和keyup。
分別對應(yīng)的意思是:按鍵被按下(按下按鍵但還沒有抬起)、點(diǎn)擊按鍵(按下并抬起按鍵)、按鍵抬起(按鍵抬起之后)
按鍵的分類
按鍵可以分為“實(shí)鍵”和“虛鍵”
實(shí)鍵可以理解為我們能夠看到并打印出來的按鍵,如字母“A”、數(shù)字“1”、字符“?”等等
虛鍵就是那些無法打印出來起到控制作用的按鍵,如“Ctrl”、“Alt”、“Shift”、“方向鍵”等等
IE在處理虛鍵時(shí)有個(gè)特例:虛鍵不會(huì)產(chǎn)生keypress事件,必須使用keydown或keyup來捕獲
按鍵碼和字符碼
按鍵碼是計(jì)算機(jī)用來識別不同按鍵的編碼,每一個(gè)按鍵都有按鍵碼
字符碼是可被打印的實(shí)鍵特有的,對應(yīng)了鍵盤上顯示的字符
按鍵碼可以使用String.fromCharCode()轉(zhuǎn)換為字符碼
按鍵碼和和字符碼的對應(yīng)表可以在本文最后找到。
獲取實(shí)鍵
function getKeyCode(e) {
var keyCode = 0;
var e = e || window.event;
keyCode = e.keyCode || e.which || e.charCode;
alert(keyCode);
}
稍微解釋下
1. e為Firefox等標(biāo)準(zhǔn)瀏覽器支持的JS隱藏變量,表示一個(gè)“事件”;IE系列中沒有“e”,而是用window.event來表示“事件”;所以var e = e || window.event;就表示:獲取當(dāng)前正在發(fā)生的事件。
2. e.keyCode、e.which、e.charCode都代表獲取按鍵碼,但不同的瀏覽器支持不同的寫法
獲取虛鍵
function getKeyCode(e) {
var keyCode = 0;
var e = e || window.event;
if (e.ctrlKey) alert("ctrlKey pressed");
if (e.altKey) alert("altKey pressed");
if (e.shiftKey) alert("shiftKey pressed");
}
分別對應(yīng)的意思是:按鍵被按下(按下按鍵但還沒有抬起)、點(diǎn)擊按鍵(按下并抬起按鍵)、按鍵抬起(按鍵抬起之后)
按鍵的分類
按鍵可以分為“實(shí)鍵”和“虛鍵”
實(shí)鍵可以理解為我們能夠看到并打印出來的按鍵,如字母“A”、數(shù)字“1”、字符“?”等等
虛鍵就是那些無法打印出來起到控制作用的按鍵,如“Ctrl”、“Alt”、“Shift”、“方向鍵”等等
IE在處理虛鍵時(shí)有個(gè)特例:虛鍵不會(huì)產(chǎn)生keypress事件,必須使用keydown或keyup來捕獲
按鍵碼和字符碼
按鍵碼是計(jì)算機(jī)用來識別不同按鍵的編碼,每一個(gè)按鍵都有按鍵碼
字符碼是可被打印的實(shí)鍵特有的,對應(yīng)了鍵盤上顯示的字符
按鍵碼可以使用String.fromCharCode()轉(zhuǎn)換為字符碼
按鍵碼和和字符碼的對應(yīng)表可以在本文最后找到。
獲取實(shí)鍵
復(fù)制代碼 代碼如下:
function getKeyCode(e) {
var keyCode = 0;
var e = e || window.event;
keyCode = e.keyCode || e.which || e.charCode;
alert(keyCode);
}
稍微解釋下
1. e為Firefox等標(biāo)準(zhǔn)瀏覽器支持的JS隱藏變量,表示一個(gè)“事件”;IE系列中沒有“e”,而是用window.event來表示“事件”;所以var e = e || window.event;就表示:獲取當(dāng)前正在發(fā)生的事件。
2. e.keyCode、e.which、e.charCode都代表獲取按鍵碼,但不同的瀏覽器支持不同的寫法
獲取虛鍵
復(fù)制代碼 代碼如下:
function getKeyCode(e) {
var keyCode = 0;
var e = e || window.event;
if (e.ctrlKey) alert("ctrlKey pressed");
if (e.altKey) alert("altKey pressed");
if (e.shiftKey) alert("shiftKey pressed");
}
| 字母和數(shù)字鍵的鍵碼值(keyCode) | |||||||
| 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 |
| A | 65 | J | 74 | S | 83 | 1 | 49 |
| B | 66 | K | 75 | T | 84 | 2 | 50 |
| C | 67 | L | 76 | U | 85 | 3 | 51 |
| D | 68 | M | 77 | V | 86 | 4 | 52 |
| E | 69 | N | 78 | W | 87 | 5 | 53 |
| F | 70 | O | 79 | X | 88 | 6 | 54 |
| G | 71 | P | 80 | Y | 89 | 7 | 55 |
| H | 72 | Q | 81 | Z | 90 | 8 | 56 |
| I | 73 | R | 82 | 0 | 48 | 9 | 57 |
| 數(shù)字鍵盤上的鍵的鍵碼值(keyCode) | 功能鍵鍵碼值(keyCode) | ||||||
| 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 |
| 0 | 96 | 8 | 104 | F1 | 112 | F7 | 118 |
| 1 | 97 | 9 | 105 | F2 | 113 | F8 | 119 |
| 2 | 98 | * | 106 | F3 | 114 | F9 | 120 |
| 3 | 99 | + | 107 | F4 | 115 | F10 | 121 |
| 4 | 100 | Enter | 108 | F5 | 116 | F11 | 122 |
| 5 | 101 | - | 109 | F6 | 117 | F12 | 123 |
| 6 | 102 | . | 110 | ||||
| 7 | 103 | / | 111 | ||||
| 控制鍵鍵碼值(keyCode) | |||||||
| 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 |
| BackSpace | 8 | Esc | 27 | Right Arrow | 39 | -_ | 189 |
| Tab | 9 | Spacebar | 32 | Dw Arrow | 40 | .> | 190 |
| Clear | 12 | Page Up | 33 | Insert | 45 | /? | 191 |
| Enter | 13 | Page Down | 34 | Delete | 46 | `~ | 192 |
| Shift | 16 | End | 35 | Num Lock | 144 | [{ | 219 |
| Control | 17 | Home | 36 | ;: | 186 | \| | 220 |
| Alt | 18 | Left Arrow | 37 | =+ | 187 | ]} | 221 |
| Cape Lock | 20 | Up Arrow | 38 | ,< | 188 | '" | 222 |
| 多媒體鍵碼值(keyCode) | |||||||
| 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 | 按鍵 | 鍵碼 |
| 音量加 | 175 | ||||||
| 音量減 | 174 | ||||||
| 停止 | 179 | ||||||
| 靜音 | 173 | ||||||
| 瀏覽器 | 172 | ||||||
| 郵件 | 180 | ||||||
| 搜索 | 170 | ||||||
| 收藏 | 171 | ||||||
您可能感興趣的文章:
- js獲取及判斷鍵盤按鍵的方法
- JS實(shí)現(xiàn)獲取鍵盤按下的按鍵并顯示在頁面上的方法
- JavaScript onkeypress事件入門實(shí)例(按下或按住一個(gè)鍵盤按鍵)
- JavaScript onkeydown事件入門實(shí)例(鍵盤某個(gè)按鍵被按下)
- js在輸入框屏蔽按鍵,只能鍵入數(shù)字的示例代碼
- JS獲取鍵盤上任意按鍵的值(實(shí)例代碼)
- js獲取鍵盤按鍵響應(yīng)事件(兼容各瀏覽器)
- js中各瀏覽器中鼠標(biāo)按鍵值的差異
- 按鍵盤方向鍵翻頁跳轉(zhuǎn)的javascript代碼(支持ie,firefox)
- JavaScript 監(jiān)聽textarea中按鍵事件
- JS判斷是否長按某一鍵的方法
相關(guān)文章
Javascript獲取當(dāng)前日期的農(nóng)歷日期代碼
這篇文章主要介紹了利用Javascript獲取當(dāng)前日期的農(nóng)歷日期代碼,很實(shí)用,需要的朋友可以參考下2014-10-10
淺析JavaScript中的特殊函數(shù)及用法小結(jié)
JavaScript中的函數(shù)本質(zhì)上是一個(gè)對象,我們可以將這個(gè)對象賦值給一個(gè)變量,這就使JavaScript中的函數(shù)變得非常的靈活,現(xiàn)在就來淺看一下JavaScript中函數(shù)的一些用法,需要的朋友可以參考下2022-06-06
一道面試題引發(fā)的對javascript類型轉(zhuǎn)換的思考
本文主要介紹了javascript類型轉(zhuǎn)換的相關(guān)知識,具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-03-03
JavaScript的9種繼承實(shí)現(xiàn)方式歸納
這篇文章主要介紹了JavaScript的9種繼承實(shí)現(xiàn)方式歸納,本文講解了原型鏈繼承、原型繼承(非原型鏈)、臨時(shí)構(gòu)造器繼承、屬性拷貝、對象間繼承等繼承方式,需要的朋友可以參考下2015-05-05
一文詳解JavaScript的事件監(jiān)聽(最新整理)
Web頁面需要經(jīng)常和用戶之間進(jìn)行交互,而交互的過程中我們可能想要捕捉這個(gè)交互的過程,比如用戶點(diǎn)擊了某個(gè)按鈕、用戶在輸入框里面輸入了某個(gè)文本、用戶鼠標(biāo)經(jīng)過了某個(gè)位置,下面介紹下JavaScript的事件監(jiān)聽,感興趣的朋友一起看看吧2024-01-01
Js操作樹節(jié)點(diǎn)自動(dòng)折疊展開的幾種方法
這篇文章主要介紹了Js操作樹節(jié)點(diǎn)自動(dòng)折疊展開的幾種方法,需要的朋友可以參考下2014-05-05
var?let?const關(guān)鍵字之間的區(qū)別及使用場景示例詳解
這篇文章主要為大家介紹了var?let?const關(guān)鍵字之間的區(qū)別及使用場景示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-12-12

