好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

HTML5 表单元素

html5 的新的表单元素:

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

本章介绍以下新的表单元素:

datalist

keygen

output

@H_ 403 _22@ 标签 @H_ 301 _24@ 描述@H_ 301 _24@

<datalist>

为 <input> 标签 定义选项列表
请与 input 元素配合使用该元素,来定义 input 可能的值

<keygen>

标签 规定用于表单的密钥对 生成 器字段

<output>

标签 定义不同类型的 输出 ,比如脚本的 输出


浏览器 支持 @H_ 403 _22@ Input type@H_ 301 _24@ IE@H_ 301 _24@ Firefox@H_ 301 _24@ Opera@H_ 301 _24@ Chrome@H_ 301 _24@ Safari@H_ 301 _24@ datalist No No 9.5 No No keygen No No 10.5 3.0 No output No No 9.5 No No


datalist 元素

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

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

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

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

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


keygen 元素

keygen 元素的作用是提供一种验证 用户 的可靠 方法 。

keygen 元素是密钥对 生成 器(key-pair generator)。当提交表单时,会 生成 两个键, 一个 是私钥, 一个 公钥。

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

目前,浏览器对此元素的糟糕的 支持 度不足以使其成为一种有用的安全标准。

实例
<form?action="demo_form.asp"?method="get">
Username:?<input?type="text"?name="usr_name"?/>
Encryption:?<keygen?name="s ecurity "?/>
<input?type="submit"?/>
</form>

output 元素

output 元素用于不同类型的 输出 ,比如计算或脚本 输出 :

将计算结果 显示 在 <output> 元素

<form?oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input?type="range"?id="a"?value="50">100?+
<input?type="number"?id="b"?value="50">=
<output?name="x"?for="a?b"></output>
</form>

运行以上范例,在浏览器中 显示 如下



HTML5 表单属性 ? ?HTML5 新的 Input 类型

查看更多关于HTML5 表单元素的详细内容...

  阅读:44次

上一篇

下一篇

第1节:HTML5 教程    第2节:HTML5 浏览器支持    第3节:HTML5 新元素    第4节:HTML5 Video 视频    第5节:HTML 5 Video + DOM    第6节:HTML5 内联 SVG    第7节:HTML5 新的 Input 类型    第8节:HTML5 MathML 数学公式    第9节:HTML5 Geolocation 地理定位    第10节:HTML5 Canvas画布    第11节:HTML5 拖放 ( drag 和 drop )    第12节:HTML5 Audio 音频    第13节:HTML5 Web Workers    第14节:HTML5 表单元素    第15节:HTML5 表单属性    第16节:HTML5 语义元素    第17节:HTML5 Web 存储    第18节:HTML5 Web SQL 数据库    第19节:HTML5 应用程序缓存    第20节:HTML 5 服务器发送事件    第21节:HTML5 WebSocket    第22节:HTML5 历史记录API    第23节:HTML 5 代码规范    第24节:HTML5 Canvas 描边和填充    第25节:HTML5 Canvas 绘制矩形    第26节:HTML5 Canvas 清除画布    第27节:HTML5 Canvas 渐变    第28节:HTML5 Canvas 合成    第29节:HTML5 Canvas 绘制图像    第30节:HTML5 Canvas 绘制文本    第31节:HTML5 Canvas 阴影    第32节:HTML5 Canvas 路径    第33节:HTML5 Canvas 转换    第34节:HTML5 Canvas 状态    第35节:HTML5 Canvas toDataURL()    第36节:HTML5 Canvas 像素处理    第37节:HTML5 Canvas 制作动画