输入字符，跨浏览器答案

【问题标题】：get character typed, cross-browser输入字符，跨浏览器
【发布时间】：2015-09-10 10:25:55
【问题描述】：

简单的问题 -- 有没有人知道一个可靠的跨浏览器函数来获取从 keydown 事件输入的字符？我可以从 quirksmode 网格中编写一个，但我宁愿不为如此简单但又如此不标准的东西重新发明轮子。

让我澄清一下：

仅使用event.keyCode 或event.which 是无法做到这一点的。整体逻辑是这样的：

获取密钥代码
检测移位，ctrl
如果 ctrl，忽略
创建带和不带 shift 键的键码映射
- 示例地图{186 : ';', 187 : '=', 188 : ',', ....}
- 需要一个单独的映射用于 shift 键修饰符
- 地图需要根据浏览器进行更改（尤其是 Safari Mac，其键码为 60,000）
如果keycode在map中，返回映射键
如果keycode不在map中，规范化数字，必要时应用shift修饰键，返回String.fromCharCode(key)

这不是一个简单的解决方案，这就是我寻找预制解决方案的原因:)

【问题讨论】：

【解决方案1】：

你愿意使用 jQuery 吗？

$("input").bind("keydown",function(e){ var value = this.value + String.fromCharCode(e.keyCode); }

我相信切换到按键事件可以解决您评论中提到的问题。下面的代码能满足您的要求吗？

$("input").bind("keypress",function(e){ var value = this.value + String.fromCharCode(e.keyCode); }

【讨论】：

不起作用，因为 jQuery 不规范化 charCode，只有 keyCode。这里的问题很多，但忽略了不同的国际化键盘具有不同键码的事实：“Q”上方的“1”与数字键盘上的“1”不同（您上面的代码将返回“1”或“a”，具体取决于按下）。 "A" 是 keydown 事件中的 "Shift+a" 等等......逻辑并不复杂，只是有很多不同的情况，不同的浏览器会有不同的行为......
你根本不需要 jQuery。
是的，jQuery 完全没有为这个答案添加任何内容。

【解决方案2】：

多年来我一直在想同样的事情。最近，我厌倦了必须查找事件的键码，我编写了一个名为keysight 的模块，该模块将keypress、keydown 和keyup 事件分别转换为字符和键。

例子：

 element.addEventListener("keydown", function(event) {
    var character = keysight(event).char
 })

它不会忽略 ctrl 上的任何内容，因此如果需要，您必须手动执行此操作。但它完成了您给出的所有其余逻辑。

【讨论】：