关于表单的自动完成属性—autocomplete

本文讲述了在公司勤怠管理系统中遇到的autocomplete属性问题及解决方案。由于一个全角空格的存在,导致该属性未能正常工作,从而引起浏览器自动完成提示框与自定义列表框重叠的问题。文章还介绍了autocomplete属性的基本原理及其在不同浏览器中的表现。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近公司内部的勤怠管理系统进行了一系列改造,主要是改善用户体验方面的。其中一项改进就是引入了一个类似Google搜索提示那样的功能,在输入项目名称时可以给出列表供用户选择。但在某些浏览器下列表框却一直和浏览器的自动完成提示框同时出现,重叠在一起,反而带来更多不便。刚才去帮忙看了一下前台代码,找到了问题所在。原来虽然已经追加了autocomplete = “off”属性,却因为一个莫名其妙的全角空格而没发挥任何作用……

 

之后关于autocomplete属性,又在网上搜索了一番。从以下几篇文章中获得了些内容:

 

AUTOCOMPLETE Attribute | autocomplete Property

Using AutoComplete in HTML Forms

实现google那种输入框提示的功能

 

大致归纳一下,收获了以下几点:

1.该属性受制于浏览器设置,可在浏览器中将其全局关闭。

2.对于自动完成机能,浏览器是根据各元素的name或VCARD_NAME属性(DOM)来识别其身份的。这也就是用户名在不同网站间能够互相索引到的原因。

3.该属性起初是IE引入的,可能会遇到浏览器支持问题。不过HTML5已将其列入标准,并且为其提供了default值—on。

具体可参见:http://www.w3.org/TR/2010/WD-html5-20100624/common-input-element-attributes.html#the-autocomplete-attribute

转载于:https://www.cnblogs.com/millionhere/archive/2010/08/03/1791099.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值