扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章主要讲解了如何用代码实现JavaScript监听键盘事件，内容清晰明了，对此有兴趣的小伙伴可以学习一下，相信大家阅读完之后会有帮助。
在写网页的时候，常常需要监听键盘事件，让我们来看看如何实现吧。
监听方式
键盘事件往往是全局监听，设监听的函数为keyboard()。
keyup事件类型。该类型触发条件为按键按下去并松开。
//长按并松开只触发一次
document.addEventListener('keyup', keyboard);
document.onkeyup = keyboard; //记得不要加括号！
keydown事件类型。该类型触发条件为按键按下去。
//长按可以触发多次
document.addEventListener('keydown', keyboard);
document.onkeydown = keyboard;
keypress事件类型。该类型触发条件为按键按下去且产生了字符。
//长按可以触发多次
//遇到'1'，'a'，回车等按键可以触发，但del键，向上键等则不会
document.addEventListener('keypress', keyboard);
document.onkeypress = keyboard;
需要注意的是：keypress的兼容性并不是很好，比如安卓系统就不支持，所以尽量避免使用。
onkey___ 和 addEventListener之间，最好选后者。
另外，如果keyboard不带参，则监听的事件是任何符合条件的按键，即只要你按了键盘，就会触发事件。
监听具体事件（即按了哪个键）
上文提到的keyboard函数是可以设形参的，且在调用的时候不需加实参。
function keyboard(eve) {
...
}
document.onkeyup = keyboard; //不需要加参数和括号
此时的eve便是键盘事件类型的变量，它有以下属性：
| 属性 | 意义 |
|---|---|
| key | 事件对应按钮的字符 |
| keyCode | 事件对应按钮的Unicode码 |
| which | 事件对应按钮的Unicode码 |
其中，不同的浏览器对keyCode和which的支持情况是不同的，下文会有关于提升兼容性的方法。
举个例子：
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网