HTML5+CSS3 新的表单元素

在上述内容中，详细了解一下表单中所新增的标签的类型，以及属性内容。此外，HTML 5中还新增了以下3个表单元素。 1．Datalist元素

datalist元素规定输入域的选项列表。列表是通过datalist内的option元素创建的。如需把datalist绑定到输入域，在标签中，通过list属性引用datalist的id。

语法： 下面通过一个示例来查看一下，该元素的应用方法。 示例：3-12 datalist.html 选择图书： 执行上述代码，可以看到一个文本框，而单击该文本框，即可弹出一个列表。

单击 显示列表

2．Keygen元素

keygen元素的作用是提供一种验证用户的可靠方法。keygen元素是密钥对生成器（key-pair generator）。当提交表单时，会生成两个键，一个是私钥，一个公钥。

私钥（private key）存储于客户端，公钥（public key）则被发送到服务器。公钥可用于之后验证用户的客户端证书（client certificate）。

示例：3-13 keygen.html

此时，用户可以输入“用户名”，以及单击【下拉】按钮选择密钥内容。

输入 单击 选择

3．Output元素

容，如随机的数字。而在传递时，则以加

标签与

标签

密方式显示。

是相对应的，通过标签内容，不

难理output元素用于不同类型的输出，比如计算或脚本输出。

语法： 在选择密钥时，用户可以看看到密钥内

下面通过一个示例，来显示两个数字框中，两个数字之和。然后，通过

标签显示出结果。

单击 输入 显示结果

在代码中，document.forms[\"sumform\"][\"aa\"].value语句，用来获取“数字”框中的数

字内容。而“ document.forms[\"sumform\"]

[\"sum\"].value=parseFloat(x)+parseFloat(y)”语句，用来给

标签赋值。其中， parseFloat()函数是将文本型转换成数字型。