javascript Android 版 Chrome 中的密钥代码始终为零

Keycode is always zero in Chrome for Android

提问by barrrrrrrrrooo

I need to detect the keycode for a custom search box on my website, but the keycode always returns as zero on Chrome for Android (except for backspace, which returns 8). Has anyone else experienced this, and how did you get around it? Our website works on all mobile browsers except Chrome for Android because we can't detect a non-zero keycode or charcode.

我需要在我的网站上检测自定义搜索框的键码，但键码在 Chrome for Android 上始终返回为零（退格键除外，它返回 8）。有没有其他人经历过这种情况，你是如何解决的？我们的网站适用于除 Android 版 Chrome 之外的所有移动浏览器，因为我们无法检测到非零键码或字符码。

I'm running Chrome 27.0.1453.90 on Android 4.1.2 Jelly Bean. The problem can be duplicated with something as simple as:
alert(event.keyCode);

我在 Android 4.1.2 Jelly Bean 上运行 Chrome 27.0.1453.90。这个问题可以用以下简单的方法来复制：
alert(event.keyCode);

回答by coder

below solutionalso work for me. might be useful for others also.

下面的解决方案也适用于我。可能对其他人也有用。

var getKeyCode = function (str) {
    return str.charCodeAt(str.length - 1);
}

document.getElementById("a").onkeyup = function (e) {
    var kCd = e.keyCode || e.which;
    if (kCd == 0 || kCd == 229) { //for android chrome keycode fix
        kCd = getKeyCode(this.value);
    }
    alert(kCd)
}

回答by Danny Coulombe

I faced this issue and this is how I figured out how to solve the problem.

我遇到了这个问题，这就是我想出如何解决这个问题的方法。

• First, you need to enable USB debugging onto your Android phone so you can see the logs of your browser on your desktop machine.
• Second, refresh your web app on your phone and inside your console on the desktop type "monitorEvents(document)" or whatever element you want to inspect.
• Do the action you want to inspect on your phone.

• 首先，您需要在 Android 手机上启用 USB 调试，以便您可以在台式机上查看浏览器的日志。
• 其次，在您的手机和控制台内刷新您的 Web 应用程序，在桌面键入“monitorEvents(document)”或您想要检查的任何元素。
• 在手机上执行您要检查的操作。

And this is how I found that the keydown event was actually fired by a unique event called "textInput" which contains the information inside event.originalEvent.data.

这就是我发现 keydown 事件实际上是由一个名为“textInput”的唯一事件触发的，该事件包含 event.originalEvent.data 中的信息。

Hope this saves you time and good luck!

希望这可以节省您的时间并祝您好运！

回答by Sergei Panfilov

If anybody still digging it.Problem appears on stock Samsung keyboard for androiddevices.

如果有人还在挖掘它。问题出现在android设备的三星键盘 上。

Instead use onkeyup.

而是使用onkeyup.

回答by Johnny Zhao

We encountered this problem recently on a China made Android phone Meizu MX3, which has a deeply customized OS based on Android 4.4.4.

我们最近在一台国产安卓手机魅族MX3上遇到了这个问题，魅族MX3有一个基于安卓4.4.4的深度定制操作系统。

The default browswer and Chrome work just fine, but for some weird reasons we don't know, event.keyCode, event.charCodeand event.whichreturn 0 all the time in some other browsers(such as CM Browseror webview of Wechat app).

默认browswer和Chrome的工作就好了，但对于一些奇怪的原因，我们不知道，event.keyCode，event.charCode和event.which返回0所有的时间在其他一些浏览器（如CM浏览器或微信应用的网页流量）。

We resolved this by checking the last character you input such as 'A' or ' '(space), then we convert it to ascii code using charCodeAt such as "A".charCodeAt(0)which returns 97, which is the actual char code we need.

我们通过检查您输入的最后一个字符（例如 'A' 或 ' '（空格））来解决此问题，然后我们使用 charCodeAt 将其转换为 ascii 代码，例如“A”.charCodeAt(0)返回 97，这是实际的字符我们需要的代码。

But we can only determine the char code of visible chars using this strategy, which meets our current need thank god.

但是我们只能使用这种策略来确定可见字符的字符代码，这满足了我们目前的需求谢天谢地。

Hope you guys can get some inspiration from this.

希望大家能从中得到一些启发。

回答by Raghu

I have faced the same issue with Android Devices of SonyXperia and HTC. I have developing hybrid application where i am validating Amount text field by reading event.keyCode()of the entered char on keydownevent from text field, so that i can allow only numbers and dot(.) char to be entered. I tried but it doesn't worked, returning always 0 in these devices. Later i came with other solution with keyupevent and char matching through Regular Expression:

我在 SonyXperia 和 HTC 的 Android 设备上遇到了同样的问题。我正在开发混合应用程序，我通过从文本字段读取事件中event.keyCode()输入的字符来验证金额文本字段 keydown，以便我只能允许输入数字和点（.）字符。我试过了，但没有用，在这些设备中总是返回 0。后来我提出了其他解决方案，keyup通过正则表达式进行事件和字符匹配：

$("#AmountField").keyup(function (e) {

    var regex = /^[0-9\.]$/;
    var str = $(this).val();
    var subStr = str.substr(str.length - 1);
    if(!regex.test(subStr)) {

        if(str.length >0){
            $(this).val(str.substr(0, (str.length - 1)));
        }else{ 
            $(this).val();
        }

    }

});

Hope this can help for the people who facing this issue. Good Luck.

希望这可以帮助面临这个问题的人。祝你好运。

回答by g.e.manor

The true way to get the keyCode is to use

获取keyCode的真正方法是使用

event.which

This property on event object is standardize the event.keyCodeproperty. You can read about it also in jQuery documentation hereor in MDN here

事件对象上的这个属性是标准化的event.keyCode属性。您也可以在此处的jQuery 文档或此处的 MDN 中阅读有关它的信息

In other way, I have a lot of experience with keyboard events on android devices. Android browser has problems sometimes with keyboard events due to device fragmentation (different ROMs between devices or external keyboard apps). The best way is to try to use all the keyboard events (keydown, keyup and keypress) and compare every result to get the pressed key.

换句话说，我对 Android 设备上的键盘事件有很多经验。由于设备碎片（设备或外部键盘应用程序之间的 ROM 不同），Android 浏览器有时会出现键盘事件问题。最好的方法是尝试使用所有键盘事件（keydown、keyup 和 keypress）并比较每个结果以获得按下的键。

The best way is to use in "input" event and get all the time the last charter. The input event can control like in my answer here.

最好的方法是在“输入”事件中使用并始终获取最后一个包机。输入事件可以像我在这里的回答一样进行控制。

回答by coder

<input type="text" id="char" size="15" onblur="showKeyCode()" value="a">
<input type="button" value="Show Key Code" onclick="showKeyCode();">
<script>
function showKeyCode()
{
    var character = document.getElementById ( "char" ).value.substr(this.length - 1);
    var  code = character.charCodeAt();

    var stringall = document.getElementById ( "char" ).value;
    var msg = "The Key Code for the \""+character+"\" character is "+code+".";
    alert(msg);
 }
</script>

For reference

以供参考

回答by Atif Mahmood

Need to use charCodeinstead of keyCode

需要使用charCode而不是keyCode

<input type="text" onKeyPress="return funName(this,event)" />

<script language="javascript">
function funName(th,ev)
{   
   alert(ev.charCode);
}
</script>

回答by George

change the type of the input to tel : <input type="tel">

将输入类型更改为 tel ： <input type="tel">

this will let you log the keyCode but it doesnt log the backspace, and it might force the keyboard on mobile to only numbers.

这将让您记录 keyCode 但它不会记录退格键，并且它可能会强制移动键盘上的键盘只能输入数字。

回答by Siddharth Pandey

So in most Android browser if u use keydown or keyup you wont be able to get the data from key or keyCode or which or code

因此，在大多数 Android 浏览器中，如果您使用 keydown 或 keyup，您将无法从 key 或 keyCode 或 which 或 code 获取数据

You can use event.data(Inserted data key) and event.inputType(backspace or del in mobile)

您可以使用 event.data(Inserted data key) 和 event.inputType(backspace or del in mobile)

In order to achieve the functionality you need you have to apply condition based on user agent for android mobile

为了实现您需要的功能，您必须根据 Android 手机的用户代理应用条件

if (navigator.userAgent.match(/Android/i)) {
    node.addEventListener('input', handleInput, false);
  } else {
    node.addEventListener('keydown', handleKeyDown, false);
  }


  const handleKeyDown = event => {
    event.preventDefault();
    if (!event.key) {
      return false;
    }
    genericFunctionHandleThings(event.key, event.code === 'Backspace');
  };

 const handleInput = event => {
    event.preventDefault(); // Here event.preventDefault doesn't stop user from typing
    genericFunctionHandleThings(event.data, event.inputType === 'deleteContentBackward');
    node.value = storedOrProcessedValue;
  };

Here I have used node.value = storedOrProcessedValue because if we want to make some restriction for user typing we need to process and re assign it to the input

在这里我使用了 node.value = storedOrProcessedValue 因为如果我们想对用户输入进行一些限制，我们需要处理并将其重新分配给输入

You can use this with Input type text,url,email,tel these I have tested rest I need to check

您可以将它与输入类型文本、网址、电子邮件、电话一起使用，这些我已经测试过了，我需要检查一下