表单是与用户交互的页面，HTML5将用于处理用户计算机中表单的代码库标准化，提供了新的属性、元素和完整的API。

1.表单元素：

表单没有太大的改动，其结构仍然保持不变，但HTML5增加了新的元素、输入类型和属性，可以根据需要进行扩展。

1)

元素：

创建一个基本的表单模板：

Forms 元素除一些常见属性，也有一些扩展属性。

·autocomplete：可以添加on和off两个值，默认是on。如果设为off，表单所包含的元素就不会显示作为可选值的文字。

和其他独立的元素都支持这个属性。

·novalidate：HTML5内置了验证功能，如果不想使用这个行为，可以使用属性novalidate。

2)元素：

表单中最重要的元素是，使用type属性可以改变元素性质。HTML5扩大了选择范围，还规定了浏览器对所接收信息的处理方式，从而增强了元素的功能。Type属性与其他属性一起，可以帮助浏览器实时限制和控制用户输入。

⑴电子邮件类型：

几乎每个表单都会使用输入域接收电子邮件地址，但目前唯一支持这种数据的输入类型是text。Text表示一般文字，而非特殊字符，所以必须使用JavaScript控制输入数据，确认所插入内容是一个有效的电子邮件地址。

现在有了email类型，浏览器会检查输入域中插入的文字，验证其是否为合法的电子邮件地址。如果验证失败，表单就不会发送。示例：

各种浏览器有不同的无效输入响应方式。例如，在表示错误信息时，一些浏览器会在元素周围显示红色框，另一些浏览器则显示蓝色框。也可以定制错误响应方式。

⑵搜索类型：

Search类型不能控制输入，作用是指示浏览器。示例：

有一些浏览器会修改元素的默认设计，向用户提示域的用途。

⑶URL类型：

这种类型的作用与email完全相同，但主要针对网址。只接受绝对URL，如果输入无效URL会显示错误信息。示例：

⑷电话号码类型：

这种类型主要针对电话号码。Tel类型没有规定特殊的语法，作用是指示浏览器，该应用程序需要根据不同的设备进行调整。示例：

⑸数字类型：

Number类型只能接受数字值。这个域还可以使用其他一些新属性：

·min：这个属性决定了域所能接受的最小值

·max：这个属性决定了域所能接受的最大值

·step：这个属性值决定了域所能接受值递增或递减的步长。例如，如果步长设置为5，最小值为0，最大值为10，那么浏览器就不允许输入0~5和5~10之间的值。示例：

不一定要同时设置min和max，step的默认值是1。

⑹范围类型：

这是一种新增域类型。这种新控件允许用户选择一个范围的数值，通常会显示为滑块或箭头，用于增大或缩小数值，但目前还没有标准设计。

Range类型使用属性min和max，设置范围的下限值和上限值，此外还可以设置属性step，声明设置该值递增或递减的步长。示例：

使用旧的value属性，可以设置元素的初始值；使用JavaScript可以在屏幕上显示数值。

⑺日期类型：

这是一种新控件，用来创建一个日期输入域。浏览器使用日历实现这个功能，用户可以单击域选择时间。用户可以选择日历中的一天，浏览器会将它与其他日期一同插入输入框中。示例：

标准并没有规定它的页面设计，每一种浏览器都有不同的界面，并且有时候会根据应用程序所运行的设备不同而调整设计。通常，这个控件值的格式是：year-month-day。

⑻周类型：

这种类型提供一种与date类类似的界面，但是只能选择周。通常，这个控件值的格式是：2016-W50，其中2016是年份，50是周数。示例：

⑼月份类型：

这种类型与周类型类似，但是只能选择一个月份。通常，这个控件值的语法是：year-month。示例：

⑽时间类型：

Time类型与date类型，但是只能选择时间。它的格式包括小时和分钟，但其具体行为取决于不同浏览器的实现。通常，它的值的格式为：hour:minutes:seconds，但也可以是：hour:minutes。示例：

⑾日期与时间类型：

Datetime类型支持输入完整的日期和时间，其中还包括时区。示例：

⑿本地日期与时间类型：

datetime-local类型是一种不带时区的datetime类型。示例：

⒀颜色类型：

Color类型具有预定义的颜色拾取界面。通常，这个域的预期值是十六进制数，如#00FF00。示例：

HTML5没有规定标准的color界面，但是浏览器都会使用一组包含基本颜色的网格界面。

2.新属性：

有一些输入类型要求使用特定的属性才能够达到显示效果，也有一些输入类型需要使用一些属性来改进其性能。

1)Placeholder属性：

Placeholder属性通常用于文本框输入类型，也可以用在search等，表示一个简短提示、单词或词汇，可用于帮助用户输入正确的内容。示例：

这个属性可以显示一些提示内容，当该输入文本框获取焦点时提示信息就会消失。

2)Multiple属性：

Multiple属性也必须设置布尔值，可以用在一些输入类型中，如email或file，从而支持在同一域中输入多个值。所插入的值必须用逗号分隔。示例：

3)autofocus属性：

autofocus属性会使网页加载后强制聚焦到所选元素上，每个页面只允许出现一个autofocus属性的input元素。但会考虑目前的状况，如果用户已经在网页上聚焦到某个元素，那么不会改变聚焦状态。示例：

以前，开发人员通常使用JavaScript的focus()方法来实现这个特性。

4)autocomplete属性：

可用于form元素和输入型的input元素，用于表单自动完成。autocomplete属性会把输入的历史记录下来，当再次输入时，会把输入的历史记录显示在一个下拉列表中，以实现自动完成输入。示例：

autocomplete属性有"on"、"off"和""等3个值。使用""时，使用浏览器的默认值。

5)form属性：

可用于在

标记之外声明表单元素。示例：

以前，必须使用标记

才能创建表单，然后在标记之间声明各个表单元素。HTML5支持在文档的任意位置插入元素，然后使用form属性通过名称引用表单。

6)formaction属性：

表单可以通过action属性把内容提交到另外一个页面。HTML5中，为不同的提交按钮添加formaction属性，该属性可以覆盖action属性，将表单提交至不同页面。示例：

7)formmethod、formentype、formnovalidate、formtarget属性：

使用方法与formaction一致，设置在提交按钮上，可以覆盖表单的相应属性。formmethod覆盖method属性，formentype覆盖entype属性，formnovalidate覆盖novalidate，formtarget覆盖target。

8)list属性：

与datalist元素配合使用，可以为某个可输入的input元素定义一个选值列表。见datalist。

3.新的表单元素：

1)元素：

datalist元素使用list属性，可以为某个可输入的input元素定义一个选值列表。使用datalist元素构建选值列表，设置input元素的list属性为datalist元素的id值，实现二者的绑定。示例：

test1@test.com

test1@test.com

目前只有Opera和Firefox Beta实现了元素。

2)元素：

这是一个表单特有的元素，表示一个任务完成的进度。通常这些任务都在表单中启动和处理，因此可以添加到表单元素组中。

元素使用两个属性设置其状态和限制，value属性表示任务执行的进度，max声明任务完成后达到的值。

3)元素：

元素可用于显示刻度，而非进度，可用于表示一个已知范围，例如带宽使用。

元素有一些相关属性，min和max可用于设置范围边界，value可用于确定测量的值，而low、high和optimum可用于将范围划分为不同的部分和设置最佳位置。

4)元素：

用于不同类型的输出，如用于计算结果或脚本的输出等，必须从属于某个表单，即写在表单内部，通常用于显示表单处理的结果值。示例：

由于range类型的input元素表现为一个滑块，不显示数值，因此使用output元素协助显示其值。使用for属性可以将与参与计算的源元素相关联。但这个元素通常是在JavaScript代码中引用和修改。

5)Keygen元素：

提供一种安全的方式验证用户。该元素有密钥生成的功能，当提交表单时，会分别生成一个私人密钥和一个公共密钥，其中私人密钥保存在客户端，公共密钥则通过网络传输至服务器。这种非对称加密方式，为网页的数据安全提供了更大的保障。示例：

Encryption:

Keygen元素提供了中级和高级的加密算法，显示的是一个类似select元素的下拉框，可以选择加密等级。