HTML笔记 javascript ·

js监听按键方法及按键对照表

js可以通过document.onkeydown来监听键盘按下事件,用以在网页上做出响应的处理,使用方法如下:

document.onkeydown = function (event){
  // 此处不建议使用keyCode,该方法已经废弃了
  console.log("按下" + event.key + '键:' + event.code)
}

这里推荐使用code来判断,keyCode即将废弃,如果是字母如C则为KeyC

至于是组合按键来说一般主要有altKey、ctrlKey、shiftKey,当组合按下(如ctrl+c)时,ctrlKey为true,

document.onkeydown = function (event){
  if(event.ctrlKey && event.code === 'KeyC'){

  }
}

keyCode对照表

左侧字母和数字键

按键 键码 按键 键码 按键 键码 按键 键码
A 65 B 66 C 67 D 68
E 69 F 70 G 71 H 72
I 73 J 74 K 75 L 76
M 77 N 78 O 79 P 80
Q 81 R 82 S 83 T 84
U 85 V 86 W 87 X 88
Y 89 Z 90 0 48 1 49
2 50 3 51 4 52 5 53
6 54 7 55 8 56 9 67

数字小键盘上的键

按键 键码 按键 键码 按键 键码 按键 键码
0 96 1 97 2 98 3 99
4 100 5 101 6 102 7 103
8 104 9 105 * 106 + 107
Enter 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

控制键键码

按键 键码 按键 键码 按键 键码 按键 键码
BackSpace 8 Tab 9 Clear 12 Enter 13
Shift 16 Control 17 Alt 18 CapeLock 20
Space 32 Page Up 33 Page Down 34 End 35
Home 36 Left Arrow 37 Up Arrow 38 Right Arrow 39
Down Arrow 40 Insert 45 Delete 46 Number Lock 144
;: 186 =+ 187 ,< 188 _- 189
.> 190 /? 191 `~ 192 [{ 219
| 220 ]} 221 '" 222

参与评论