masked input not working in android mobiles?

问题:

I am using the digitalbush masked input jQuery plugin. It is working fine in web browsers and the iPhone browser perfectly, but it is not working for Android mobile devices.

My issue : mask is in input field _ - _ - ___.

When I type numbers it will 12345685555___--

Example: http://rossbender.com/temp/mask.html

Any suggestions? How can I solve this?

Thanks Prasad.

回答1:

I resolved this issue with three actions, which have fixed this for all Android 4.0+ phones:

1. Update masked-input to at least version 1.4
2. Add type="tel" to the input, to trigger the numeric keyboard
3. Remove the input's maxlength attribute or set it to a value certain not to interfere with the caret action, like 20.

回答2:

I tried using the raw script that Jonathan Rowny mentioned, but I was still having the same problem on an S3 - Chrome browser. I think it has something to do with inputs type="tel" and/or type="number". I ended up having to use another plugin. http://igorescobar.github.io/jQuery-Mask-Plugin/

jquery-mask (not to be confused with jquery-masked-input) is very similar but the syntax was slightly different. Hope this helps anyone else with this issue.

jquery-masked-input syntax: $("#phone").mask("[phone]");

VS

jquery-mask syntax: ('#phone').mask('[phone]');

回答3:

This was fixed awhile ago but for some reason the distribution posted on the website never took the changes. If you grab from the raw source, the fix works: https://raw.githubusercontent.com/digitalBush/jquery.maskedinput/master/src/jquery.maskedinput.js

回答4:

After trying different mask libraries (Inputmask, ui-mask, ngMask) I ended up using jQuery-Mask-Plugin https://igorescobar.github.io/jQuery-Mask-Plugin/ which works pretty well and is also lightweight and well documented and has angularjs, react ,... samples.

回答5:

I just ran into this problem and resolved it by removing the attribute type="number" from the asp textbox. After that masked input worked even on mobile devices.

回答6:

The library used in the question is no longer being maintained. I switched my application to jQuery Mask Input as it works great, has a very similar base init call to the former library making for an extremely easy transition and, at the time of this post, jQuery Mask Input is regularly maintained at GitHub.

My issue was with the phone number masker moving the cursor back to the second position when 3 or 4 digits were entered. The cursor continued to act odd after that point. The problem was noticed using jQuery Masked Input v1.4.1 (old library) in android tablets using Chrome post major version 51.