js组合键和单个键盘事件
Posted 流楚丶格念
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js组合键和单个键盘事件相关的知识,希望对你有一定的参考价值。
js 里面的键盘码对应的值
内容过多,请移驾另一篇博文:
https://yangyongli.blog.csdn.net/article/details/118753001
监听单个按键
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script type = "text/javascript" language = JavaScript charset = "UTF-8" >
document.onkeydown=function(event) {
var e = event || window.event || arguments.callee.caller.arguments[0];
if (e && e.keyCode == 27) { // 按 Esc
//要做的事情
console.log('按下了Esc');
}
if (e && e.keyCode == 113) { // 按 F2
//要做的事情
console.log('按下了F2');
}
if (e && e.keyCode == 13) { // enter 键
//要做的事情
console.log('按下了enter');
}
};
</script>
</body>
</html>
监听组合键
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
//快捷键调用
// type:双组合键事件,可选alt、shift、 ctrl 如不是三个参数之一则为单键事件
// keycode:键盘对应的值
// callback:回调函数
// dom: 给某元素添加事件,默认为document
function callspeedykey(type, keycode, callback, dom) {
var dom = dom == undefined ? document : document.getElementById(dom);
console.log(dom)
dom.onkeydown = function (event) {
var e = event || window.event || arguments.callee.caller.arguments[0];
if (type == 'shift') {
if (e && e.keyCode == keycode && e.shiftKey) {
callback('shift');
};
} else if (type == 'alt') {
if (e && e.keyCode == keycode && e.altKey) {
callback('alt');
};
} else if (type == 'ctrl') {
if (e && e.keyCode == keycode && e.ctrlKey) {
callback('ctrl');
};
} else {
if (e && e.keyCode == keycode) {
callback('enter');
};
};
};
};
function callback(type) {
console.log(type);
console.log('组合键'+type+'与enter');
};
callspeedykey('alt', '13', callback)
</script>
</body>
</html>
以上是关于js组合键和单个键盘事件的主要内容,如果未能解决你的问题,请参考以下文章
Atitit.android js 的键盘按键检测Back键Home键和Menu键事件