js给按钮增加快捷键功能(全)

一、前言

最近在开发的过程中，有个需求需要给按钮增加快捷键的功能，但是对每个按钮对应的keycode不是太清楚，这就是该文章的来历了。

二、给页面添加按钮监控事件

通过onkeydown给页面添加一个监听按键按下的事件。代码如下所示：

document.onkeydown = function(e){
	e = e || window.event;
}

三、按键对应的keycode

3.1 字母键和数字键对应的keycode

如下所示：

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

3.2 数字键盘上的键对应的keycode

废话不说，直接看下边的内容：

按键	键码	按键	键码
0	96	9	105
1	97	*	106
2	98	+	107
3	99	Enter	108
4	100	-	109
5	101	.	110
6	102	/	111
7	103
8	104

3.3 功能键对应的keycode

按键	键码	按键	键码
F1	112	F7	118
F2	113	F8	119
F3	114	F9	120
F4	115	F10	121
F5	116	F11	122
F6	117	F12	123

3.4 控制键对应的keycode

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

四、结语

道阻且长，行则将至，行而不辍，未来可期，加油。

原创不易，如果你觉得文章不错，对你的进步有那么一点帮助，那么就给个小心心，如果觉得文章非常对你的胃口，那么欢迎你关注我，或者关注个人的微信公众号 程序猿每日分享，这里有资源，有内推，有和你志同道合的朋友，咱们一起打怪升级。