HTML5--表单标签input新增type值

文章内容大部分都引用于W3C，仅供笔者自己使用参考。

1.input标签新增type值以及浏览器支持情况

---

2.新增type值中常用的

2.1 Input 类型 - email

email 类型用于应该包含 e-mail 地址的输入域。

在提交表单时，会自动验证 email 域的值。

备注：默认email只做了@匹配，对于长度，com,cn, [ . ]等都没做处理

如下图所示

实例

E-mail: <input type="email" name="user_email" />

---

2.2 Input 类型 - Date Pickers（日期选择器）

HTML5 拥有多个可供选取日期和时间的新输入类型：

date - 选取日、月、年month - 选取月、年week - 选取周和年time - 选取时间（小时和分钟）datetime - 选取时间、日、月、年（UTC 时间）datetime-local - 选取时间、日、月、年（本地时间）下面的例子允许您从日历中选取一个日期：

使用场景：生日、入职日期、看病日期记录、日记等等

type为date时视图

实例

Date: <input type="date" name="user_date" />

---

2.3 Input 类型 - search

search 类型用于搜索域，比如站点搜索或 Google 搜索。

search 域显示为常规的文本域。

实例

Date: <input type="search" name="user_date" />