监听键盘事件

方法一

document.addEventListener("keydown",function(e){
    alert("您按下的按钮的keyCode为："+e.keyCode)
})

方法二

document.onkeydown = function (e) {
    // 方向键--上
    if (e.keyCode == 38) {
        alert("按下了方向键--上")
    }
    // 方向键--下
    if (e.keyCode == 40) {
        alert("按下了方向键--下")
    }
    // 方向键--左
    if (e.keyCode == 37) {
        alert("按下了方向键--左")
    }
    // 方向键--右
    if (e.keyCode == 39) {
        alert("按下了方向键--右")
    }
}

注意this的使用

调用methods的方法时，最好使用that，因为this在子路由或子组件中不能直接获取到

let that = this
document.addEventListener("keydown",function(e){
    // 方向键--上
    if (e.keyCode == 38) {
        // 执行向上移动的方法
        that.moveUP()
    }
})

js 获取键盘keyCode值的方法

使用下方代码，可以在按下键盘时，即刻了解键盘对应的keyCode值

document.addEventListener("keydown",function(e){
    alert("您按下的按钮的keyCode为："+e.keyCode)
})

或 

document.onkeydown = function (e) {
    alert("您按下的按钮的keyCode为："+e.keyCode)
}

查表获取键盘keyCode值

当然，也可以通过查表找到键盘对应的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

数字键盘

按键	键值	按键	键值	按键	键值	按键	键值
0	96	8	104	F1	112	F9	120
1	97	9	105	F2	113	F10	121
2	98	*	106	F3	114	F11	122
3	99	+	107	F4	115	F12	123
4	100	Enter	108	F5	116
5	101	-	109	F6	117
6	102	.	110	F7	118
7	103	/	111	F8	119

控制键

按键	键值	按键	键值	按键	键值	按键	键值
Backspace	8	Esc	27	Right Arrow(->)	39	-_	189
Tab	9	Spacebar	32	Down 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