HTML5的表单元素简介

HTML5 的新的表单元素:

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>

 

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索datalist
, 表单
, 元素
, 公钥
, no
, v2007+KeyGen下载
, 附keygen(注册机)
, keygen
, 表单简介
html5表单验证
html5新增表单元素、html5新增的表单元素、html5表单元素、html5新表单元素、html5表单元素有哪些,以便于您获取更多的相关知识。

时间: 2024-08-30 23:16:25

HTML5的表单元素简介的相关文章

HTML5的表单属性简介

HTML5 的新的表单属性 本章讲解涉及 <form> 和 <input> 元素的新属性. 新的 form 属性: autocomplete novalidate 新的 input 属性: autocomplete autofocus form form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget) height 和 width list min, max 和 step mul

HTML5新增表单元素、属性、表单验证及增强的页面元素总结

 新增的表单元素与属性     新增属性         form属性         在HTML5中表单元素可放在表单之外,通过给该元素添加form属性即可,如:  代码如下 复制代码             <form method="get" id="test">             username:<input name="username" type="text" id="usern

走进HTML5入门到精通:HTML5表单元素

HTML 5 的新的表单元素: HTML 5 拥有若干涉及表单的元素和属性. 本章介绍以下新的表单元素: datalistkeygenoutput 浏览器支持 Input type IE Firefox http://www.aliyun.com/zixun/aggregation/10963.html">Opera Chrome Safari datalist No No 9.5 No No keygen No No 1 0.5 3.0 No output No No 9.5 No No

ASP.NET中实现把form表单元素转为实体对象或集合

这篇文章主要介绍了ASP.NET中实现把form表单元素转为实体对象或集合,本文又是一个对重复数据处理的一个封装,非常实用的开发技巧,需要的朋友可以参考下     简介: 做WEBFROM开发的同学都知道后台接收参数非常麻烦 虽然MVC中可以将表单直接转为集实,但不支持表单转为 LIST<T>这种集合 单个对象的用法: 表单:   代码如下: <input name='id' value='1' > <input name='sex' value='男' >   后台:

HTML5的表单新增了哪些属性?

1. 表单内元素的form属性 在H5中可以把form放到页面的任何地方,然后为该元素指定一个form属性,属性值为该表单的id,这样就可以声明该元素从属于指定表单了 <formid="testform">      <inputtype="text">     </form>     <textareaform="testform"></textarea> 2. 表单内元素的forma

Smarty简单生成表单元素的方法示例_php实例

本文实例讲述了Smarty简单生成表单元素的方法.分享给大家供大家参考,具体如下: smarty生成表单元素功能实现的原理是:给smarty一个数组,用于生成和显示菜单或选项,另外在传递一个选项的值,用于默认选择的匹配: 示例如下: php文件:index.php <?php include("smarty_inc.php"); $smarty->assign('cust_ids',array(1000,1001,1002,1003)); $smarty->assig

详解利用 HTML5 美化表单教程

全新的表单元素.属性.输入类型.基于浏览器的验证.CSS3 样式技术以及 FormData 对象让创建表单变得更轻松,甚至可能更富有趣味性. 浏览器支持 在撰写本文时,所有新的表单和输入元素以及属性和类型的支持情况都会因浏览器的不同而存在很大差异.甚至在支持特定功能的各个浏览器之间,它们的行为也会互不相同.但 HTML5 表单的支持情况变化很快,且仍在不断改进.在撰写本文时,这些图表是我能找到的最新图表,它们详细说明了各个浏览器对 HTML5 表单的支持情况. 新增内容概述 新元素 HTML5

HTML5新表单color实例讲解

1.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">  <head>  <meta http-equiv=&quo

ASP.NET中实现把form表单元素转为实体对象或集合_实用技巧

简介: 做WEBFROM开发的同学都知道后台接收参数非常麻烦 虽然MVC中可以将表单直接转为集实,但不支持表单转为 LIST<T>这种集合 单个对象的用法: 表单: 复制代码 代码如下: <input name='id'  value='1' > <input name='sex'  value='男' > 后台: 复制代码 代码如下: //以前写法             DLC_category d = new DLC_category();