Javascript - 获取任何键盘布局的键描述

Question

对于丰富的 Web 应用程序，我需要键盘快捷键。因为有许多不同的键盘布局，所以它们必须是可配置的。不幸的是，我想不出一种方法将键盘事件映射到人类可读的快捷方式名称，例如Ctrl + Alt + Y 或Alt +\.

keypress 事件是无用的，因为它不会针对所有按键触发。以下是 keydown 事件的一些属性:

• charCode:仅适用于可打印字符。 已弃用，根据 MDN
• code:有效，但忽略了键盘布局。当我按 Z 键时，我的德语键盘上出现了 code: "KeyY"。
• key:有效，但根据修饰符给出不同的结果。例如Shift+3 在我的键盘上生成 key: "§"，在大多数美式键盘上生成 key: "#"。
• keyCode:值不唯一。 Ä、Ö、Ü 或 ^ 产生 keyCode: 0。 已弃用，根据 MDN
• which:和keyCode一样，值不唯一。 已弃用，根据 MDN
• altKey、ctrlKey、metaKey、shiftKey:用于检测修改键

我应该怎么做？甚至不知道用户的键盘布局也可能吗？

Answer 1

问题是，此时你永远无法从浏览器中知道键盘布局，你只能猜测和推测。有多种方法可以尝试某种检测，但它们总是很复杂，而且不是开箱即用的解决方案。

但是，您可以通过一些操作来确定以某种方式按下了哪个键。

所以 Keydown 会给你(假设事件对象是 e):

e.code:包含一个字符串，用于标识被按下的物理键。该值不受当前键盘布局或修饰符状态的影响，因此特定键将始终返回相同的值。 (来自 mozilla.org)

e.key:事件所代表的key的键值。如果该值具有打印表示，则此属性的值与 char 属性相同。

e.which 和 e.keyCode:虽然已弃用，但会为您提供键盘上按键的位置代码，如果 e.charCode 为 0，则这是一个位置代码(如果 < 256)或 unicode(这意味着键盘切换为另一种语言)

现在这里棘手的部分是 e.key 实际上代表 unicode 字符，如果它是可打印的并且不是来自美国键盘并且不是特殊键。您可以将此字符转换为十进制数并检查值。如果它是一个 unicode 字符，它的十进制值将等于 which 和 keyCode 值。如果它是普通的 ASCII，它的小写值将等于 which 和 keyCode 值。此外，在执行此操作(转换)之前，您可以检查 e.key 是字符串(如 Control、Alt、CapsLock 等)还是字符(如 a、b、c 等)，因此如果它是char，然后你转换它。

所有这些都会让您知道按下了哪个键以及该键的 native 可打印字符是什么。我没有德语、意大利语或其他键盘来测试，但你明白了。

哦，如果您担心 Shift+3 会产生“§”或“#”，您应该始终将该组合表示为 Shift+3，无论字符是什么它会产生，更不用说 Ctrl+Shift+3 的组合会产生同样的结果。您只需担心字母字符，但我相信我已经为您提供了检查它的方法。

另外，我相信你可能甚至不需要 e.which 和 e.keyCode，因为 e.key 应该给你的一切。