vue 键盘(上下左右)快捷键
keydown:在键盘上按下某个键时触发。如果按住某个键,会不断触发该事件,但是 Opera 浏览器不支持这种连续操作。keypress:按下某个键盘键并释放时触发。如果按住某个键,会不断触发该事件。该事件处理函数返回 false 时,会取消默认的动作(如输入的键盘字符)。keyup:释放某个键盘键时触发。该事件仅在松开键盘时触发一次,不是一个持续的响应状态。在mounted中加上window.a
·
keydown:在键盘上按下某个键时触发。如果按住某个键,会不断触发该事件,但是 Opera 浏览器不支持这种连续操作。
keypress:按下某个键盘键并释放时触发。如果按住某个键,会不断触发该事件。该事件处理函数返回 false 时,会取消默认的动作(如输入的键盘字符)。
keyup:释放某个键盘键时触发。该事件仅在松开键盘时触发一次,不是一个持续的响应状态。
- 在mounted中加上window.addEventListener(“keydown”, this.KeyDown);监听
mounted() {
window.addEventListener("keydown", this.KeyDown);
}
- 在methods中写上KeyDown函数
methods: {
KeyDown(event) {
const e = event || window.event || arguments.callee.caller.arguments[0];
let key = e.keyCode; //键盘码值 keycode
if (key == 37) { //左
console.log("left");
} else if(key == 38) { //上
console.log("up");
} else if(key == 39) { //右
console.log("right");
} else if(key == 40) { //下
console.log("down");
}
},
}
- 键盘常用键的keyCode值
键位 | keyCode |
---|---|
0-9 | 48-57 |
a到z(A到Z) | 65到90 |
F1到F24 | 112到135 |
BackSpace(退格) | 8 |
Tab | 9 |
Enter(回车) | 13 |
Caps_Lock(大写锁定) | 20 |
Space(空格键) | 32 |
Left(左箭头) | 37 |
Up(上箭头) | 38 |
Right(右箭头) | 39 |
Down(下箭头) | 40 |
更多推荐
已为社区贡献1条内容
所有评论(0)