Create Phone Mask Only Html / Css

2

I would like to make a mask without plugin in a field on my form eg: (00) 0000-0000?

Using only CSS or HTML?

    
asked by anonymous 20.06.2016 / 19:30

1 answer

9

You can use regular expression in the <input> tag of html5.

It will not work as a mask but will validate the phone in the format (99-99999999) or (99-999999999).

Ex:

<input type="text" required id="partNumber" pattern="^[1-9]{2}\-[2-9][0-9]{7,8}$" />

For your example [(99) 9999-9999] the regular expression would be <input type="text" required id="partNumber" pattern="^\([1-9]{2}\)[0-9]{4}\-[0-9]{4}$" />

See working at link

Note: It will only work in newer browsers.

    
20.06.2016 / 20:46