HTML5 的新的表单元素(datalist/keygen/output)使用介绍
发布时间：2013-07-19 15:36:05 作者：佚名 
我要评论
我要评论HTML5 拥有若干涉及表单的元素和属性，下面为大家介绍下新的表单元素datalist 元素、keygen 元素、output 元素以及它们的使用实例，感兴趣的朋友可以参考下哈，希望对大家有所帮助
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：
实例
复制代码
代码如下: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>
相关文章
- 本文主要对HTML5表单新增属性进行详细介绍，并附上实例解析，简单易懂。需要的朋友一起来看下吧2016-12-21
- 下面小编就为大家带来一篇HTML Form表单元素全面了解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-09-26
- 下面小编就为大家带来一篇html5表单及新增的改良元素详解。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-06-07
- 这篇文章主要为大家介绍了HTML5新增的表单元素和属性,具有一定的参考价值！需要的朋友可以参考下2014-07-07
HTML5之HTML元素扩展(下)—增强的Form表单元素值得关注
在HTML5增强的元素中，最值得关注的就是表单元素;在HTML5中，表单已经做了重大的修整，一些以前需要通过JavaScript编码实现的功能现在无需编码就可轻松实现,感兴趣的朋友可2013-01-31- 点击这里返回网页教学网 HTML教程 栏目． 上文：标记语言——引用 原文出处 chapter 5 表单 互动性一直是互联网的重点,让使用者与网站能够交换信息2008-10-17
- 本教程介绍FORM表单标记的各种属性在网页设计中的应用. <FORM>标记的NAME属性 基本语法 01 <Form name="Form＿name"> 02 ……2008-10-17
- 假设现在要在表单中添加这样一项内容：浏览所在的城市。这里不说全国的城市，只说省会以上的城市就有几十个。如果以上面讲过的单选按钮的形式，将这些城市全部罗列在网页上2008-10-17
- 带有图片预览功能的上传表单，完整的HTML代码如下所示 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=2008-10-17
- 表单是用户提交信息的重要渠道。本节就将介绍表单的基础知识。 表单标签<form> 表单以一个<form>标签开始。用户注册网站会员，投票等等都需要表单来实现2008-10-17
最新评论