Javascript：不同浏览器上的不同keyCodes？答案

【问题标题】：Javascript: different keyCodes on different browsers?Javascript：不同浏览器上的不同keyCodes？
【发布时间】：2010-10-07 16:02:04
【问题描述】：

所以我看到一些关于不同浏览器报告不同键码的论坛帖子，但每个人似乎都避免“为什么？”。

我试图捕获冒号 (:) keyCode 并意识到 Firefox 报告回 e.keyCode 56。而 Chrome 报告回 186（我认为就是这样）。

是否有一种通用方法可以在所有浏览器中获取正确的 keyCode？p>

如果它们是相同的键，为什么它们会有所不同？

我会更好奇是否有国际化的方式来获得相同的按键。

谢谢。

【问题讨论】：

quirksmode.org/js/keys.html
@galambalazs，此图表不考虑冒号和分号。这让我很惊讶。 PPK 通常在这类事情之上。
unixpapa.com/js/key.html 有冒号和分号，看起来很详尽。
KeyEvent（因此 keyCodes）是basically deprecated and being replaced with KeyboardEvent。这不是关于为什么不同的浏览器报告不同的 keyCodes 的答案，而是希望指向未来可能成为一个好的解决方案的指针。有可能。

标签： javascript keycode

【解决方案1】：

这取决于您是否对用户按下的物理键或用户键入的字符感兴趣。如果它是您所追求的角色，您可以在所有主要浏览器中可靠地获得它（在大多数浏览器中使用 keypress 事件的 which 属性或在 IE keyCode），但仅限于 keypress事件。如果您在寻找密钥，请使用 keydown 或 keyup 事件并检查 keyCode 属性，尽管不同浏览器之间的确切键码映射确实有所不同。

可以在http://unixpapa.com/js/key.html 找到对所有 JavaScript 键相关事件的出色解释和参考。

要在所有主流浏览器中可靠地检测用户键入冒号字符，您可以执行以下操作：

document.onkeypress = function(e) {
    e = e || window.event;
    var charCode = (typeof e.which == "number") ? e.which : e.keyCode;
    if (charCode && String.fromCharCode(charCode) == ":") {
        alert("Colon!");
    }
};

【讨论】：

charCode != keyCode，除了 /[A-Z 0-9]/
@NathanBubna：我知道。但是在旧版IE的keypress事件中，keyCode混淆是字符码，不是键码，其他主流浏览器都支持which，所以keyCode只在旧版中使用IE。在unixpapa.com/js/key.html 阅读所有相关信息（在我的回答中链接到）。
伊克。旧的 IE 再次来袭。谢谢你的解释！

【解决方案2】：

请参阅http://unixpapa.com/js/key.html 了解为什么它们有不同的键。我不知道匹配键的国际方法。

【讨论】：

我包含的链接的结论部分包含一些可以帮助您实施通用解决方案的信息——这取决于您的具体情况。
你把我链接到的好文章。

【解决方案3】：

这是一个老问题。执行此操作的现代方法是使用 event.key。见MDN Key

【讨论】：

这仍然是当前的方式，因为 Key 仍处于草稿阶段，大多数移动浏览器不支持 caniuse.com/#feat=keyboardevent-key
适合你自己，离你不远。值得注意的是，目前最流行的移动浏览器 Chrome for android 已全面支持。最大的问题是 iOS 和 Safari，尽管 Safari 的支持将在下一个版本中推出。我建议使用许多可用的 polyfill 之一。
其实可以用的。大多数使用的浏览器都支持它。 (caniuse.com/#feat=keyboardevent-key) 如果属性未定义，您仍然可以使用一个小的后备函数。
请注意，在某些现代浏览器中存在差异。例如，在打开 Num Lock 的小键盘上按点键 (./Del) 会在 Edge 中将 event.key 报告为“Del”，但将其报告为“.”在铬。人们一直认为 Safari 是新的 Internet Explorer。最近我想知道 Edge 是否真的是新的 Internet Explorer。哦，等等。

【解决方案4】：

我认为你应该让 JavaScript 来获取 ':' 字符的键码，这样脚本就会知道它在特定环境中是什么。有人问过类似的问题here, in stackoverflow。

【讨论】：

【解决方案5】：

还请查看此 GitHub 文件：https://github.com/bpeacock/key-to-charCode/blob/master/jQuery.getChar.js，了解如何使用 keyDown 代替 keyPress 事件。

我在移动设备上将其用于带有键盘楔的条形码扫描仪，该扫描仪在返回 (keyPress) 数据以扫描连字符时存在错误。效果很好。除了我在带有普通键盘的浏览器中测试应用程序时，我注意到连字符在 Chrome 上有效，但在 Firefox 上无效。奇怪但真实。通过在上面的 JS 文件中添加代码 173 来修复，除了代码 189。

这让我想知道键盘实际发送的是什么。用于按下连字符键 (- _) 的 keydown 代码 173 或 189 显然不是由键盘本身发送的，而是由将 keyDown 事件发送到我的 javascript 应用程序的浏览器创建的。

【讨论】：