为“所有”浏览器（包括移动设备）获取 keyEvent 值的可靠方法答案

【问题标题】：Reliable way to get value of keyEvent for "all" browsers including Mobile为“所有”浏览器（包括移动设备）获取 keyEvent 值的可靠方法
【发布时间】：2016-02-23 08:40:41
【问题描述】：

我试图在 keyPress、keydown 或 keyUp 事件中获取 keyPressed 的值。此处的不同解决方案在 Chrome、FireFox、IE 等上运行良好。但是它们在 android 设备上失败。

我尝试了几个受以下 SO 启发的解决方案：

第一个解决方案：

element.keydown(function (e) { 
    var keyCode = e.charCode || e.keyCode || e.which;
    var digit = String.fromCharCode(keyCode);

    // here digit is "å" on android using danish locale
}

KeyUp 产生相同的结果。 KeyPressed 不会在 android 上的 chrome 上触发。

为了重现我做了一个 plunkr，它显示了行为：

https://plnkr.co/BVUfiJrBr0RBPDst9izD/

它在桌面上运行良好，但在 Android 浏览器上，keyCode 始终为229，无论按下什么键。

我在以下位置重现了错误：

三星 Galaxy S6，Android 5.1.1，浏览器：Chrome 48.0.2564.95
Sony Experia Z2，Android 5.1.1，浏览器：Chrome 48.0.2564.95

确实有效：

三星 Galaxy S6，Android 5.1.1，浏览器：Firefox
苹果手机

尝试重现错误表明 Chrome 中存在错误。有没有其他方法可以解决这个问题？

【问题讨论】：

Capture keys typed on android virtual keyboard using javascript的可能重复

标签： javascript jquery google-chrome mobile-browser

【解决方案1】：

您是否尝试过使用input 事件？曾经遇到过类似的问题，这帮助我回到了使用 Android 4.4 的日子（在 FF、Chrome 和 Android 的本机浏览器中工作）。

做了一个小例子fiddle。希望这会有所帮助！

【讨论】：

不幸的是它没有用。它为每种类型的输入返回相同的字符。

【解决方案2】：

我只需要自己解决这个问题。在我的例子中，该元素是一个文本输入元素。在 keyup 事件（在所有浏览器中触发）上，我模糊了输入。现在输入的任何内容都可以在 input.val() 中使用，并且会触发 change 事件。因此，我在输入的更改事件上添加了一个函数，该函数收集输入的内容并将焦点返回到输入。就我而言，我只需要获得一个字符。我还没有在某人快速打字并且浏览器必须在快速击键之间执行所有这些的情况下对此进行测试。

我的代码如下所示：

$('input').on( 'keyup', function(){
    $(this).blur();
});
$('input').on( 'change', function(){
    // my code to do what I want with the value that was entered,
    // which thanks to the blur() I can get from input.val()
    $(this).focus(); // return focus to the input so the user can continue
});

也许这会有所帮助？

【讨论】：