检测keyCode问题错误值答案

【问题标题】：Detect keyCode issue wrong value检测keyCode问题错误值
【发布时间】：2016-12-23 22:38:51
【问题描述】：

我需要检测用户何时选择键盘字母 ] KeyCode: 221 并在 dom 上返回字母 ]。

我的问题是：

如果事件从input 元素或document 返回，则event.keyCode 返回的值不同。

还有

在 Chrome 55.0 上测试以下问题

我得到输入： event.keyCode: 93 - String.fromCharCode: ]

我得到文件： event.keyCode：221 - String.fromCharCode：Ý

在 Firefox 50.1.0 上

我得到输入： event.keyCode: 0 - String.fromCharCode:

我得到文件： event.keyCode：221 - String.fromCharCode：Ý

我需要知道：

我的代码有什么问题？
什么是具有相同值的一致方式？

注意：我使用的是 ENG 美国国际键盘（这可能是相关的吗？）。

var input = document.getElementById('input');
var result = document.getElementById('result');
input.addEventListener('keypress', function(event) {
  result.innerHTML = `event.keyCode: ${event.keyCode} - String.fromCharCode: ${String.fromCharCode(event.keyCode)}`;

});

var resultDocument = document.getElementById('resultDocument');

document.addEventListener('keydown', function(event){
  resultDocument.innerHTML = `event.keyCode: ${event.keyCode} - String.fromCharCode: ${String.fromCharCode(event.keyCode)}`;
});

<input id="input" type="text" size="40">
<div id="result"></div>

<h1>On document</h1>
<div id="resultDocument"></div>

【问题讨论】：

这是因为要获得该字符，您需要在 Mac 上按 fn+option+9 和 AltGr+9（如果我没记错的话）在电脑上。据我所知，Fn、option 和 AltGr 没有在 javascript 中注册为按键。不幸的是，我无法提供一种独特的方式来立即获得价值。

标签： javascript jquery html google-chrome firefox

【解决方案1】：

Event.keyCode 已被弃用，inconsistent 跨浏览器，如果可用，请改用 Event.key。如果没有，最好的办法是使用诸如Keypress 之类的库。 jQuery 也可以。

【讨论】：

【解决方案2】：

这似乎很好用（至少它在 Firefox 中给出了相同的答案，尚未在其他浏览器中测试过）

var input = document.getElementById('input');
var result = document.getElementById('result');
input.addEventListener('keypress', function(event) {
  result.innerHTML = `event.which: ${event.which} - String.fromCharCode: ${String.fromCharCode(event.which)}`;
});

var resultDocument = document.getElementById('resultDocument');

document.addEventListener('keypress', function(event){
  resultDocument.innerHTML = `event.which: ${event.which} - String.fromCharCode: ${String.fromCharCode(event.which)}`;
});

<input id="input" type="text" size="40">
<div id="result"></div>

<h1>On document</h1>
<div id="resultDocument"></div>

【讨论】：

【解决方案3】：

您正在使用 keypress 事件从输入中获取 keycode 并从文档中获取 keydown。 Keyup 和 Keydown 始终返回字符大写版本的 unicode 值。所以如果你想让它区分大小写，我建议使用Keyup，否则你可以使用keypress。

http://www.javascriptkit.com/jsref/eventkeyboardmouse.shtml 查看更多信息。干杯

【讨论】：