keyboard事件（键盘事件）- JavaScript事件处理
JavaScript 键盘事件可帮助捕获用户与键盘的交互.
监听 keydown 和 keyup 事件可以知道当用户在键盘上输入的字符，这样可用于实现键盘快捷键。
keydown 和 keyup 之间的唯一区别是: keydown 在用户开始按下按钮和输入字符之前触发.keyup 在输入字符后触发。
对于大多数情况，您最终需要触发 keyup 事件， 这些事件可以添加到 document 或文本框内（以了解用户何时在页面上的任何位置按下了键）。
为了更好地理解键盘事件，你可以使用下面这个案例，在文本区域中尝试使用不同的组合键。
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>键盘事件</title> <link rel="stylesheet" href="https://www.ytwes.com/assets/css/case.min.css"> </head> <body> <form id="form" onsubmit="return false" class="form"> 防止行为: <label><input type="checkbox" name="keydownStop" value="1"> keydown</label> <label><input type="checkbox" name="keyupStop" value="1"> keyup</label> <p> 忽视行为: <label><input type="checkbox" name="keydownIgnore" value="1"> keydown</label> <label><input type="checkbox" name="keyupIgnore" value="1"> keyup</label> </p> <p>可以使用物理键盘上的任何键</p> <input type="text" placeholder="在这里输入" id="kinput"> <textarea id="area" readonly></textarea> <input id="button" type="button" value="清空" onclick="area.value = ''" /> </form> <script src="https://www.ytwes.com/assets/js/keyboard.js"></script> </body> </html>
您可以在键盘事件中感受一下就按下键盘事件触发,直观看到 event.key 和 event.code 值的键列表。
请注意，在现代设备上，还有其他“输入内容”的方法。例如，人们使用语音识别（尤其是在移动端设备上）或用鼠标复制/粘贴。
文档如有描述不清楚、错误或者过时的地方，欢迎留言指出。
文档、教程内容会不定时更新，转载请标明原帖链接，以免让过时的教程流入网络。