Problem on Android: cursor gets back after a fourth symbol

[ShamanFromSiberia]

I'm using a simple mask for phone number:

jQuery(document).ready(function(){
  jQuery("#phone-test").inputmask("+7-999-999-99-99");
});

When I typing the number 9876543210 on Android (5.1 with Chrome, Sony Xperia Z), it fills the input field like this: +7-987-543-10-26

First 3 numbers are ok. Then after I type the fourth number cursor moves before the fourth number (in this case it's 6, | symbol for cursor): +7-987-|6_--

The same repeats after the eighth number (2 in the example): +7-987-543-|26-__

So in the end it looks like +7-987-543-10-26

Why is it so messy and is there a fix for this bug?

[ShamanFromSiberia]

As I haven't found any way to fix it, the only temporary 'fix' (actually it's not a fix) I could think of is to turn Inputmask off on Android devices:

jQuery(document).ready(function(){
    var ua = navigator.userAgent.toLowerCase();
    var isAndroid = ua.indexOf("android") > -1; 
    if(!isAndroid) {
      jQuery(selector).inputmask({
        mask: "+7 (999) 999-99-99"
      });
    }
});

I hope soon the actual fix would be made/found, for the mask is a very nice way to improve UI.

[RobinHerbots]

@ShamanFromSiberia ,

Have a try with disabling predictive text

[rlapenda]

@ShamanFromSiberia ,

you can use autocomplete="off"

input id="test2" name="test2" autocomplete="off"

worked for me :)

[dusterio]

not for me :(