HTML5 input type number vs tel

html types numbers html-input
Tom picture Tom · Nov 21, 2011 · Viewed 18.1k times · Source

I'm working on updating some form inputs to HTML5. I'm not interested in validating the data so much as having the numeric key pad on mobile devices. Input type 'tel' seems to do what I want, I get the numeric keypad on iPad/mobile. Input type 'number' will also give me the numeric keypad, but it also includes the spinner box which I don't want.

What I want to know is if it's safe to use type="tel" on a credit card input? Or should I use type="number" and try to disable the spinner somehow. I was reading that disabling the spinner can crash Chrome which isn't a trade off I'm willing to make.

Also, for the time being we're using the exact same site for mobile and non-mobile users.

Answer

Eonasdan picture Eonasdan · Nov 21, 2011

I looked at this and just tried this on my Xoom with the built in browser and FF mobile (with a desktop UA string) and the tel input would seem to work just fine for this.

screeny

Related questions

Select inputs with number type through jQuery

How can I select all inputs with number type in jQuery? The following code doesn't work: $(':input[type="number"]').click(function () { alert('hello'); }); Thanks.

Read More
Limit file format when using <input type="file">?

I'd like to restrict the type of file that can be chosen from the native OS file chooser when the user clicks the Browse button in the <input type="file"> element in HTML. I have a feeling it's …

Read More
Difference between <input type='button' /> and <input type='submit' />

What is the difference between HTML <input type='button' /> and <input type='submit' />?

Read More