イベントの説明
キーボードを押した後、イベントのすべてのプロパティとメソッドを出力します(ここでは、例として1を押します)。
document.onkeydown = function(event){
console.log(event);
}
ここで注意すべきいくつかのプロパティがあります
キー:押されたキーの名前
keyCode:押されたキーのキーコード
altKey、ctrlKey、shiftKey:組み合わせが押されると(ctrl + cなど)、ctrlKeyがtrueになります
1.すべてのキーを表示
(event.keyによって押されたキーの名前を取得します)(event.keyCodeによって押されたキーコードを取得します)
document.onkeydown = function(event){
console.log("按下:"+event.key+"键:"+event.keyCode);
}
いずれかのキーを押した後の効果:
2.Enterプレスイベントを監視します
ここでは、例としてEnterキー(キーコードは13)を取り上げます。さまざまなキーを監視する必要がある場合は、キーコードを変更できます。
document.onkeydown = function(event){
if(event.keyCode==13){
// 事件
console.log("按下了回车键")
}
}
3.キーの組み合わせを監視します
これはCTRL+Aの例です
altKey: Alt+*キーの組み合わせが押されたときにtrue
ctrlKey: Ctrl+*キーの組み合わせが押されたときにtrue
shiftKey: Shift+*キーの組み合わせが押されたときにtrue
document.onkeydown = function(event){
if(event.ctrlKey & event.keyCode == 65){
console.log("按下了CTRL+A")
}
}
4.キーコード値の詳細なリスト
アルファキーと数値キーのキーコード値 | |||
ボタン | キーコード | ボタン | キーコード |
A | 65 | J | 74 |
B | 66 | K | 75 |
C | 67 | L | 76 |
D | 68 | M | 77 |
E | 69 | N | 78 |
F | 70 | O | 79 |
G | 71 | P | 80 |
H | 72 | Q | 81 |
私 | 73 | R | 82 |
アルファキーと数値キーのキーコード値 | |||
ボタン | キーコード | ボタン | キーコード |
S | 83 | 1 | 49 |
T | 84 | 2 | 50 |
U | 85 | 3 | 51 |
V | 86 | 4 | 52 |
W | 87 | 5 | 53 |
バツ | 88 | 6 | 54 |
Y | 89 | 7 | 55 |
Z | 90 | 8 | 56 |
0 | 48 | 9 | 57 |
テンキーのキーのキーコード値 | |||
ボタン | キーコード | ボタン | キーコード |
0 | 96 | 8 | 104 |
1 | 97 | 9 | 105 |
2 | 98 | * | 106 |
3 | 99 | + | 107 |
4 | 100 | 入る | 108 |
5 | 101 | - | 109 |
6 | 102 | 。 | 110 |
7 | 103 | / | 111 |
ファンクションキーキーコード値 | |||
ボタン | キーコード | ボタン | キーコード |
F1 | 112 | F7 | 118 |
F2 | 113 | F8 | 119 |
F3 | 114 | F9 | 120 |
F4 | 115 | F10 | 121 |
F5 | 116 | F11 | 122 |
F6 | 117 | F12 | 123 |
コントロールキーのキーコード値 | |||
ボタン | キーコード | ボタン | キーコード |
BackSpace | 8 | ESC | 27 |
タブ | 9 | スペースキー | 32 |
クリア | 12 | ページアップ | 33 |
入る | 13 | ページダウン | 34 |
シフト | 16 | 終わり | 35 |
コントロール | 17 | 家 | 36 |
Alt | 18 | Left Arrow | 37 |
Cape Lock | 20 | Up Arrow | 38 |
控制键键码值 | |||
按键 | 键码 | 按键 | 键码 |
Right Arrow | 39 | -_ | 189 |
Dw Arrow | 40 | .> | 190 |
Insert | 45 | /? | 191 |
Delete | 46 | `~ | 192 |
Num Lock | 144 | [{ | 219 |
;: | 186 | \| | 220 |
=+ | 187 | ]} | 221 |
,< | 188 | '" | 222 |
多媒体键码值 | |||
按键 | 键码 | 按键 | 键码 |
音量加 | 175 | ||
音量减 | 174 | ||
停止 | 179 | ||
静音 | 173 | ||
浏览器 | 172 | ||
邮件 | 180 | ||
搜索 | 170 | ||
收藏 | 171 |