vue 全局响应键盘按键/监听键盘事件（含 js 获取键盘keyCode值的方法）_js 全局监听键盘事件

监听键盘事件

方法一

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值

字符键盘

数字键盘

控制键