HTML5 的新的表单元素(datalist/keygen/output)使用介绍
2013-07-19 15:36
543 查看
HTML5 拥有若干涉及表单的元素和属性。
本章介绍以下新的表单元素:
•datalist
•keygen
•output
浏览器支持
Input type
IE
Firefox
Opera
Chrome
Safari
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:
实例
亲自试一试
提示:option 元素永远都要设置 value 属性。
keygen 元素
keygen 元素的作用是提供一种验证用户的可靠方法。
keygen 元素是密钥对生成器(key-pair generator)。当提交表单时,会生成两个键,一个是私钥,一个公钥。
私钥(private key)存储于客户端,公钥(public key)则被发送到服务器。公钥可用于之后验证用户的客户端证书(client certificate)。
目前,浏览器对此元素的糟糕的支持度不足以使其成为一种有用的安全标准。
实例
亲自试一试
output 元素
output 元素用于不同类型的输出,比如计算或脚本输出:
实例
本章介绍以下新的表单元素:
•datalist
•keygen
•output
浏览器支持
Input type
IE
Firefox
Opera
Chrome
Safari
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="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 属性。
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="security" /> <input type="submit" /> </form>
亲自试一试
output 元素
output 元素用于不同类型的输出,比如计算或脚本输出:
实例
<output id="result" onforminput="resCalc()"></output>
相关文章推荐
- HTML 5 新的表单元素 datalist keygen output
- HTML5之表单元素的使用
- html5新元素之video,audio,meter,datalist,keygen,output
- HTML5学习笔记简明版(4):新元素之video,audio,meter,datalist,keygen,output
- HTML5 script元素async、defer异步加载使用介绍
- HTML5学习笔记简明版(4):新元素之video,audio,meter,datalist,keygen,output
- html5新增加的表单元素-Keygen
- html5新增加的表单元素-output
- HTML5学习笔记简明版(4):新元素之video,audio,meter,datalist,keygen,output
- HTML5学习笔记简明版(4):新元素之video,audio,meter,datalist,keygen,output
- HTML5--使用表单外的元素
- HTML5 script元素async、defer异步加载使用介绍
- [HTML5]:所有表单元素的使用方式(附元素属性)
- HTML5画布元素canvas提供的API使用方法
- HTML5第8次课堂笔记( 模拟form表单提交数据,xml的解析,jQuery的Ajax方法使用, mui的ajax)
- HTML5中新表单元素及表单验证
- 使用html5中video自定义播放器必备知识点总结以及JS全屏API介绍
- Html5之datalist-自动匹配的的表单输入
- js创建表单元素并使用submit进行提交
- meta元素的介绍与使用