HTML5新输入类型

HTML5有几种新的表单输入类型。这些新功能提供了更好的输入控制和验证。

本章全面介绍了这些新的输入类型：

电子邮件

全球资源定位器(Uniform Resource Locator)

数字

范围

日期选择器(日期、月份、星期、时间、日期时间、日期时间-本地)

搜索

颜色

浏览器支持

输入类型IE火狐Opera Chrome Safari

电子邮件4.0 9.0 10.0否

网址4.0 9.0 10.0否

编号9.0 7.0编号

范围编号9.0 4.0 4.0

日期选择器编号9.0 10.0编号

搜索编号4.0 11.0 10.0否

颜色编号11.0否否

注意：Opera最支持新的输入类型。但是你已经可以在所有主要的浏览器中使用它们了。即使不支持，它仍然可以显示为常规文本字段。

输入类型-电子邮件

电子邮件类型用于应包含电子邮件地址的输入字段。

提交表单时，会自动验证电子邮件字段的值。

例子

E-mail:输入类型='email '名称='user_email' /

你自己试试

提示：iPhone中的Safari浏览器支持电子邮件输入类型，通过改变触摸屏键盘(添加@和)进行匹配。com选项)。

输入类型-url

url类型用于应包含URL地址的输入字段。

提交表单时，会自动验证url字段的值。

例子

主页：输入类型='url '名称='user_url' /

你自己试试

提示：iPhone中的Safari浏览器支持url输入类型，并通过更改触摸屏键盘(add。com选项)。

输入类型-编号

类型号用于应包含数值的输入字段。

您还可以设置您接受的数量限制：

例子

Points:输入类型=' number ' name=' points ' min=' 1 ' max=' 10 '/

你自己试试

使用以下属性指定对数字类型的限制：

属性值描述

更大数量指定允许的更大值

最小数量指定允许的最小值

步数指定合法的数字间隔(如果步='3 '，合法的数字是-3，0，3，6等。)

数值指定默认值

请尝试一个具有所有限定属性的示例：自己尝试

提示：iPhone中的Safari浏览器支持数字输入类型，通过改变触摸屏键盘(显示数字)进行匹配。

输入范围的类型

范围类型用于应该包含数值范围的输入字段。

范围类型显示为滑块。

您还可以设置您接受的数量限制：

例子

输入类型='范围'名称='点数'最小值='1 '更大值='10' /