HTML5常用的input类型,HTML5 input类型

简介

HTML5 拥有多个新的表单输入类型，这些新特性提供了更好的输入控制和验证。其中比较常用的有color，date，datetime，email，month，number，range，search，tel，time，url，week本篇文章对一些常用的HTML5 input进行讲解。

input color类型

color类型的input字段用于选取颜色，浏览器(不同浏览器可能展示不同)默认提供一个颜色选择器，可以选取颜色也可以输入颜色代码，当然选取的值还得写程序去获取。

Document

选择颜色:

input date类型

date类型是input字段是一个日期控件，方便用户输入日期

日期:

与date类似作用的是time类型，它提供的是一个时间选择器。

时间:

input email类型

email类型的表单会自动校验输入值是否合法邮箱

E-mail:

input month类型

month类型的input字段定义一个月份和年份的控件。

月和年:

input week类型

week类型的input字段定义一个周次和年份的控件。一年的第一个星期一 为第一周开始。

周次和年:

input number类型

number类型的input会验证值是否为数字，同时也可以设置值的区间。

IE9 以下版本浏览器兼容HTML5的方法

数字1~5:

input rang类型

rang类型的input定义一个滑动条，可以滑动选值，需要设置值区间。

Value:

input url类型

url类型的表单会校验输入的值是否合法url。

主页:

input tel类型

tel类型定义输入电话号码字段，该字段被浏览器识别保存后，下次会推荐输入值，但对号码验证似乎还没比较好的支持。

电话号码:

input search类型

search类型定义一个搜索字段，类似搜索引擎，该类型会对值进行保存和推荐。

Search:

HTML5 input的输入类型很多，但主流浏览器对这些类型的支持情况不一样，使用前建议参考浏览器兼容性。