189 8069 5689

HTML5新增常用的表单元素是什么

这篇文章主要介绍了HTML5新增常用的表单元素是什么,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

创新互联专注于企业成都全网营销、网站重做改版、兴宁网站定制设计、自适应品牌网站建设、H5建站商城网站建设、集团公司官网建设、外贸营销网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为兴宁等各大城市提供网站开发制作服务。

本章介绍以下新的表单元素:datalist;keygen;output

datalist 元素:

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

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

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

Webpage: 




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

keygen 元素:

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

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

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

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


Username: 
Encryption: 

output 元素:

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

Input 类型:

HTML5拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。

1.Input 类型- email

email 类型用于应该包含e-mail 地址的输入域。在提交表单时,会自动验证email 域的值。

2.Input 类型- url

url 类型用于应该包含URL 地址的输入域。在提交表单时,会自动验证url 域的值。

3.Input 类型- number

number 类型用于应该包含数值的输入域。您还能够设定对所接受的数字的限定:

4.Input 类型- range

range 类型用于应该包含一定范围内数字值的输入域。

range 类型显示为滑动条。

您还能够设定对所接受的数字的限定:

5.Input 类型- Date Pickers(数据检出器)

HTML5 拥有多个可供选取日期和时间的新输入类型:

date - 选取日、月、年

month - 选取月、年

week - 选取周和年

time - 选取时间(小时和分钟)

datetime - 选取时间、日、月、年(UTC 时间)

datetime-local - 选取时间、日、月、年(本地时间)

6.Input 类型- search

search 类型用于搜索域,比如站点搜索或Google 搜索。

search 域显示为常规的文本域。

<知识点>

定义供用户输入的表单

定义输入域