HTML5新增的表单元素

HTML5 新的 Input 类型

HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。

• email
• url
• number
• range
• Date pickers (date, month, week, time, datetime, datetime-local)
• search
• color

Eg:

1. Input 类型 - email email 类型用于应该包含 e-mail 地址的输入域;在提交表单时，会自动验证 email 域的值

E-mail: <input type="email" name="user_email" />
<!--提示：iPhone 中的 Safari 浏览器支持 email 输入类型，并通过改变触摸屏键盘来配合它（添加 @ 和 .com 选项）。-->

HTML5 的新的表单元素

HTML5 拥有若干涉及表单的元素和属性。

• datalist
• ******
• output

datalist 元素 datalist 元素规定输入域的选项列表

列表是通过 datalist 内的 option 元素创建的。

如需把 datalist 绑定到输入域，请用输入域的 list 属性引用 datalist 的 id：

Webpage: <input type="url" list="url_list" name="link" />
<datalist id="url_list">
	<option label="W3School" value="http://www.W3School.com.cn" />
	<option label="Google" value="http://www.google.com" />
	<option label="Microsoft" value="http://www.microsoft.com" />
</datalist>

提示：option 元素永远都要设置 value 属性。

HTML5 的新的表单属性

新的 form 属性：

• autocomplete
• novalidate

新的 input 属性：

• autocomplete
• autofocus
• form
• form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget)
• height 和 width
• list
• min, max 和 step
• multiple
• pattern (regexp)
• placeholder
• required

Eg: HTML5新增的表单元素不包括

• A. password；
• B. color；
• C. date；
• D. number;