Comment: I believe everyone knows the improvements of HTML5. What I want to introduce below are two new input element types, email and url. Let's follow the code to see their benefits. Interested friends can refer to it.
In the previous blog post, we have discussed some HTML5 improvements, such as placeholder, prefetching and webStorage. What I want to introduce below are two new input element types: email and url. Let's follow the code to see their benefits:Syntax format:
The new input type property will use email or url instead of text:
<!-- email, non-@ + non-@ symbols, you can also use other ones,
For example [a-zA-Z0-9]{3,30}@[a-zA-Z0-9]+/w*/.(com|cn|org|net) -->
<input type="email" pattern="[^@]*@[^@]*" value="">
<!-- url -->
<input type="url" value="">
Using HTML5's unique pattern domain, you can provide a regular expression to verify the format of email and URL addresses, which we will discuss in another article.
advantage
- Special css style can be customized, input[type=email]
- Special css style can be customized, input[type=url]
- More semantic definitions can be made
- Mobile application adaptability: Mobile browser will pop up special keyboards for email and URLs without user manual switching.
At first I was disgusted with adding unnecessary input types, but after thinking deeply, I think it is a good move to improve the user experience. What do you think?