Keycode is always zero in Chrome for Android

Question

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

Answer 1

Need to use charCode instead of keyCode

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

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

Answer 2

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

You can use event.data(Inserted data key) and 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

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

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

Answer 3

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.

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

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.

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.

Answer 4

below solution also 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)
}

Answer 5

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.

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.

Hope this saves you time and good luck!

Answer 6

The true way to get the keyCode is to use

event.which

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

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.

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.