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 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.

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);

Answer 1

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 2

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 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

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 keydown event 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 keyup event and char matching through Regular Expression:

$("#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.

Answer 5

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

Instead use onkeyup.

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.

Answer 7

<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

Answer 8

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 9

change the type of the input to 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.