javascript_javascript スキルにおけるキーボード イベントの使用分析の例

この記事では、JavaScript でのキーボード イベントの使用法を例とともに分析します。皆さんの参考に共有してください。詳細は以下の通りです。

キーボード イベントには、onkeydown、onkeypress、onkeyup が含まれます

イベントの初期化

function keyDown(){} 
document.onkeydown = keyDown; 
//论按下键盘上的哪个键，都将调用KeyDown()函数。 

DOM 標準

function keyDown(e) { 
var keycode = e.which; //取得对应的键值（数字） 
var realkey = String.fromCharCode(e.which); //取得代表改键的真正字符 
alert("按键码: " + keycode + " 字符: " + realkey); 
} 
document.onkeydown = keyDown 

IE の場合

function keyDown() { 
　　 　　 var keycode = event.keyCode; //IE下取得键值的方法 
　　 　　 var realkey = String.fromCharCode(event.keyCode); 
　　 　　 alert("按键码: " + keycode + " 字符: " + realkey); 
} 
document.onkeydown = keyDown 

対応メソッド

function keyUp(e) { 
　　 　 var currKey=0,e=e||event; 
　　 　 currKey=e.keyCode||e.which||e.charCode; 
　　 　　var keyName = String.fromCharCode(currKey); 
　　 　 alert("按键码: " + currKey + " 字符: " + keyName); 
} 
document.onkeyup = keyUp; 

使用原則: keydown イベントはファンクション キーに最も役立ち、keypress イベントは印刷可能なキーに最も役立ちます

次のキー コード値は、テキスト ボックス内でのみ有効です。

タグで使用される場合は、文字キー、数字キー、および一部の制御キーのみが使用できます。キーは ASCII 値と同じです

英数字キーのキーコード値(keyCode)

キーコード
65
B 66
C 67
D68
E 69
F70
G 71
H 72
私73
J 74
K75
L 76
M 77
N 78
O 79
P 80
Q 81
R82
S 83
T84
う 85
V86
W 87
X 88
Y89
Z90
0 48
1 49
2 50
3 51
4 52
5 53
6 54
7 55
8 56
9 57

テンキーボードのキーのキーコード値 (keyCode) ファンクションキーのキーコード値 (keyCode)

キーコード
0 96
1 97
2 98
3 99
4 100
5 101
6 102
7 103
8 104
9 105
* 106
107
108
と入力してください - 109
. 110
/ 111
F1 112
F2 113
F3 114
F4 115
F5 116
F6 117
F7 118
F8 119
F9 120
F10 121
F11 122
F12 123

コントロールキーのキーコード値(keyCode)

キーコード
バックスペース 8
Esc 27
右矢印 39
左矢印 37
下矢印 40
上矢印 38
-_189
.>190
スペースバー 32
タブ 9
12をクリア
ページアップ 33
ページダウン 34
13
を入力してください 45
を挿入 ;: 186
46
を削除 `~ 192
/?191
Num Lock 144
コントロール 17
ホーム 36
エンド35
シフト16
[{ 219
}] 221
| 220
= 187
、 「222
」 ケープロック20
Alt 18

この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。