HTML5 input元素类型：email及url介绍

在前面的博文,我们已经讨论了一些HT ML 5改进的地方，比如placeholder, PR efetching以及 webstorage ,下面我要介绍的是两个新的input元素类型: em ai l和url。让我们跟着代码来看看他们的好处：

语法格式：
新的input ty PE 属性，将使用 email 或者 url 来替代text:

复制代码

代码如下:

<!-- email, 非@ + @ + 非 @ 符号，也可以使用其他的啦,
比如 [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="">

使用HTML5所特有的pattern属性域，你可以提供一个正则表达式来验证email和 url地址 的格式，我们将在另一篇 文章 讨论这个 话题 。

优点
- 可以定制特殊的css样式，input[type=email]
- 可以定制特殊的css样式，input[type=url]
- 可以做更多的语义定义
- 移动应用适配性：移动浏览器将会为email和url弹出特殊的键盘， 不用 用户手动切换。

最初我很反感添加多余的input type，但深入思考后我 觉得 对于 提高 用户体验是一个很好的举措，你认为呢？

总结

以上是 为你收集整理的 HTML5 input元素类型：email及url介绍 全部内容，希望文章能够帮你解决 HTML5 input元素类型：email及url介绍 所遇到的问题。

如果觉得 网站内容还不错， 推荐好友。

查看更多关于HTML5 input元素类型：email及url介绍的详细内容...