一、在现代设备上，还有其他“输入内容”的方法。如，人们使用语音识别（尤其是在移动设备上）或用鼠标复制/粘贴。
二、如果要跟踪字段中的所有输入，那么键盘事件是不够的。还需要一个名为input的事件来跟踪字段中的更改。
三、我们想要处理键盘行为时，应该使用键盘事件（虚拟键盘也算）。如，对方向键Up和Down或热键（包括案件的组合）作出反应。
四、按一个按键总是会产生一个键盘事件，无论是符号键，还是例如 Shift 或 Ctrl 等特殊按键。
1、唯一的例外是有时会出现在笔记本电脑的键盘上的 Fn 键。它没有键盘事件，因为它通常是被在比 OS 更低的级别上实现的。

keydown 、keyup

一、当一个按键被按下时，会触发keydown事件，而当按键被释放时，会触发keyup事件。

event.code、evnet.key

一、事件对象的key属性允许获取字符，而事件对象的code属性则允许获取“物理按键代码”。
二、同一个按键Z，可以与或不与Shift一起按下。我们会得到两个不同的字符：小写的z和大写的Z。
1、evnt.key正是这个字符：并且它将是不同的。但是，event.code是相同的。

2、如果用户使用不同的语言，那么切换到另一种语言将产生完全不同的字符，而不是“Z”。它将成为event.key的值，而event.code始终是一样的：“KeyZ”。
三、每个按键的代码都取决于该按键在键盘上的位置。
1、UI事件代码规范：
见：https://www.yuque.com/tqpuuk/yrrefz/ixdth3
2、按键没有给出任何字符，如Shift，F1或其他。

四、【示例1】我们要处理一个热键：Ctrl + Z，大多数文本编辑器将“撤销”行为挂在骑上。我们可以在keydown上设置一个监听器，并检查哪个键被按下了。

document.addEventListener('keydown', function(event) {
  if (event.code == 'KeyZ' && (event.ctrlKey || event.metaKey)) {
    alert('Undo!')
  }
});

五、【示例1】美式布局（“QWERTY”）、德式布局（“QWERTZ”）

1、对于同一个按键，美式布局为“Z”，而德式布局为“Y”。
2、美式键盘中，按下”Z”，event.code = ‘KeyZ’，对于使用德式布局键盘的人来说，他们按下Y时，event.code = ‘KeyZ’
3、所以，event.code可能由于意外的键盘布局而与错误的字符进行了匹配。
六、event.key， event.code使用场景
1、event.key：处理与布局有关的按键。
2、event.code：希望在热键即使在切换了语言后，仍能正常使用。

自动重复

一、如果按下一个键足够长的时间，它就会开始“自动重复”：keydown 会被一次又一次地触发，然后当按键被释放时，我们最终会得到 keyup。因此，有很多 keydown 却只有一个 keyup 是很正常的。
二、对于由自动重复触发的事件，event 对象的 event.repeat 属性被设置为 true。

默认行为

一、默认行为各不相同，因为键盘可能会启动许多可能的东西。
1、出现在屏幕上的一个字符（最明显的结果）。
2、一个字符被删除（Delete 键）。
3、滚动页面（PageDown 键）。
4、浏览器打开“保存页面”对话框（Ctrl+S）
5、…
二、阻止对 keydown 的默认行为可以取消大多数的行为，但基于 OS 的特殊按键除外。
【示例1】在 Windows 中，Alt+F4 会关闭当前浏览器窗口。并且无法通过在 JavaScript 中阻止默认行为来阻止它。
【示例2】下面的这个 期望输入的内容为一个电话号码，因此它不会接受除数字，+，() 和 - 以外的按键：

<script>
function checkPhoneKey(key) {
  return (key >= '0' && key <= '9') || key == '+' || key == '(' || key == ')' || key == '-';
}
</script>
<input onkeydown="return checkPhoneKey(event.key)" placeholder="Phone, please" type="tel">

1、像 Backspace，Left，Right，Ctrl+V 这样的特殊按键在输入中无效。这是严格过滤器 checkPhoneKey 的副作用。
【示例3】放松过滤条件，让方向键和删除键都能正常使用

<script>
function checkPhoneKey(key) {
  return (key >= '0' && key <= '9') || key == '+' || key == '(' || key == ')' || key == '-' ||
    key == 'ArrowLeft' || key == 'ArrowRight' || key == 'Delete' || key == 'Backspace';
}
</script>
<input onkeydown="return checkPhoneKey(event.key)" placeholder="Phone, please" type="tel">

遗存

一、过去曾经有一个 keypress 事件，还有事件对象的 keyCode、charCode 和 which 属性。
二、大多数浏览器对它们都存在兼容性问题，以致使该规范的开发者不得不弃用它们并创建新的现代的事件（keydown / keyup），除此之外别无选择。旧的代码仍然有效，因为浏览器还在支持它们，但现在完全没必要再使用它们。