作者:sanesTT | 来源:互联网 | 2020-07-28 09:48
新表单属性最完整的表单属性可以通过查阅w3cschoolh5表单属性获取,这里仅针对常见属性讲解autocomplete(自动完成)能够记录用户的输入,并且给予提示,这就是autocomplete的作用取值:on:开启off:关闭适用情况:一般用在input标签中示例代码:使用注意:标签需要添加name属性只有提交了一次以后才会出现提示autofocus(获取焦点)当某一...
新表单属性
最完整的表单属性可以通过查阅w3cschool-h5表单属性获取,这里仅针对常见属性讲解
autocomplete(自动完成)
能够记录用户的输入,并且给予提示,这就是autocomplete
的作用
使用注意:
标签需要添加name
属性
只有提交了一次以后才会出现提示
autofocus(获取焦点)
当某一页有很多个可供输入的元素时,用户需要使用鼠标点选元素进行输入,为了提升用户体验,我们可以通过autofocus
属性来指定页面中默认选中的元素
form(表单关联)
当我们想要提交数据时,需要把表单元素
放到对应的form
标签中,这个属性的出现让表单元素
的放置位置不在受到约束
姓名:
年龄:
爱好:
使用注意:
虽然这个属性可以让元素的放置位置不在成为限制,但是编码时依旧建议,将元素放置到对应的表单中,除了兼容性问题以外,也为了提升代码的可读以及可维护性
multiple(多选)
如果想要在某个input
标签中选择多个值,可以使用该属性
placeholder(占位提示)
输入元素内默认显示一些提示信息,当用户输入之后自动消失,这种效果我们需要使用Javascript
来实现,知道出现了placeholder
这个属性
使用方式:
适用情况:
示例代码:
placeholder.png
新的表单元素
除了在input标签中增加了一些新的type
属性以外,H5
也推出了一些新的表单元素,由于浏览器的兼容问题,使用频率并不广,了解即可 w3cSchool_新表单元素
datalist
该元素规定了输入区域的选项列表,可以让用户有一些选项
网址:
电话:
keygen
keygen 元素是密钥对生成器(key-pair generator)。当提交表单时,会生成两个键,一个是私钥,一个公钥。
私钥(private key)存储于客户端,公钥(public key)则被发送到服务器。公钥可用于之后验证用户的客户端证书(client certificate),即实现非对称加密
目前,浏览器对此元素的糟糕的支持度不足以
使其成为一种有用的安全标准。
output
属于新的语义标签:用来放置输出的内容,但是不能自动的计算结果,依旧需要通过js的方式来动态修改结果,只是相比于其他的标签,语义性更强
。
【