HTML5的Form表单输入类型实例分析
本篇内容介绍了"HTML5的Form表单输入类型实例分析"的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！
您可能已经熟悉input元素的type属性。这是一个能够决定何种表单输入将呈现给用户的属性。如果它被省略——或者是在旧版浏览器中使用新的输入类型，
尽管浏览器不能识别，但仍可运行：input元素将默认为type="text"。这就是如今HTML5表单便于使用的关键。如果您使用新的输入类型，如email或search，旧版浏览器将简单地呈现给用户一个标准的文本字段。
我们的注册表单目前使用您比较熟悉的10种输入类型中的4种：check-box、text、password和submit。在HTML5之前，所有类型的完整列表如下所示：
button、checkbox、file、hidden、image、password、radio、reset 、submit、text。
HTML5带给我们的输入类型提供了更多的数据特定相关的用户界面元素以及自带的数据验证。HTML5共有13种新输入类型：
search、email、url、tel 、datetime、date、month、week、time、datetime-local 、number、range、color。
让我们详细看一下这些新类型，并学习如何使用它们。
search
search输入类型(type="search")提供一个搜索字段，是一个一行的文本输入控件，可以输入一个或多个搜索术语。规范说明如下：
文本状态与搜索状态的区别主要是在格式上：搜索字段平台与常规文本字段平台的不同之处在于，搜索状态可能导致外观与平台搜索字段一致，而不像一个常规的文本字段。
许多浏览器在设置search输入的样式时，与浏览器或操作系统搜索框风格一致。一些浏览器添加了单击鼠标清除输入的功能。
指定一个或多个电邮件地址。它支持布尔硝multiple属性，允许多个逗号分隔的电子邮件地址。
如果您使用iOS设备，变化就会很明湿。当您聚焦电子邮件字段时，iPhone、iPad和iPod都会显示一个电子邮件输入的键盘（有一个@符号的快捷键）。
Firefox、Chrome和Opera还提供电子邮件输入错误信息。
自定义验证信息
不喜欢提供的错误信息吗？在某些浏览器中，您可以使用．setCustomVal-idity (errorMsg)设置您自己的错误信息。．setCustomValidity仅将您想提供的错误信息当作唯一的参数．如果您想完全删除错误信息，可向．setCustomValidity传递空字符串。
不幸的是，尽管您可以改变信息的内容，但您不能更改它的外观，至少目前是这样。
URL
url 输入类型(type="url")用于说明网站地址。
l would like to receive
lname="quantity" id-"'quantity '> copies of The HTML5 Herald
--
数字输入类型由min和max属性来规定最人和最小允许值。我们强烈推荐您使用这些属性，否则使用向上和向下箭头可能会导致不同的值（非常奇怪），这取决
于浏览器。
您也可以提供step属性，这样可以通过单击上和下的箭头使数值增加或减少。
range
range输入类型(type="range")在览器中显示一个滚动控件。和数字类型一样，它允许使用min、max和step属性。根据规范，number和range的区别是：在range类型中所输入的具体数
的精确值是不重要的。如果您想得到一个小精确的数字，这是一个理想的输入类型。
step属性的默认值是1，所以它不是必需的。range输入类型的默认值是滚轴的中间点——换句话说，就是最小值和最大值之
间的中间值。规范规定：如果指定的最大值小于最小值，就允许使用反向滚动轴（数值从右到左，而不足从左到右）。
color
color输入类型(type="color")为用户提供了颜色选取器，颜色选取器会返回一个十六进制的RGB颜色值，比如#FF3300。
如果您想使用color输入提供占位符文本，表明必须使用十六进制RGB颜色格式，井使用pattern属性对其进行限制，只允许输入有效的十六进制颜包值，那么就必须等到完全支持这个输入类型。
我们不存表单中使用color输入类型，但是，如果采用此输入类型，应使用下
列代码：
