How to open the numeric keypad on the phone when entering the <input type="text" ... field? Need to enter multiple phone numbers

  • Doesn't she open herself? - Alexey Shimansky

1 answer 1

Good day! Using the css property of the appearance, you can make an absolutely identical text field from the number field. At the same time, of course, a numpad will open on mobile phones.

Demo: https://jsfiddle.net/w96k/8srhucp7/1/

 <div> <input type='number'> </div> <br> <div> <input type='text'> </div> input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; } input[type="number"] { -moz-appearance: textfield; }
  • one
    with input - everything is fine, but I also need to later write down a pair of phone numbers separated by a comma in a numeric field with this style, but Ivan Ivan
  • Hmm .. Let me see what I can do. In general, as a quick solution, it would be possible to write a script that, when attempting to enter a comma, would create a second input field for the next number. - w96k
  • I also considered a similar option, but unfortunately, everything becomes more complicated (input, output, edit) ... - Ivan
  • In fact, it seems to me that it will even be easier than to parse these numbers. Okay. I will now update the demo with the option to create new fields. On the topic I found an article: ctrl.blog/entry/html5-input-number-localization In the firefox works. - w96k
  • Perhaps there is another way to achieve display numpada in android. - w96k