如何清除input输入框历史下拉数据
当之前的input框输入了数据后,下次输入有历史记录,这是浏览器为了方便用户通过之前的缓存来自动填充表单的功能,但很多时候我们不需要自动填充历史记录。并且发现无论是清除cookie,还是删除浏览器历史记录,都没办法清空input下拉的历史记录信息。那么该如何解决该问题呢?下面分享3种方案供大家参考。
方法一、代码实现
input标签中它支持autocomplete属性,该属性规定form或input域应该拥有自动完成功能。他对应的值如下:
on 默认。规定启用自动完成功能。
off 规定禁用自动完成功能。
autocomplete支持的属性值有好几十个,而这2个事最常用的。所以我们只需要设置 autocomplete='off',这样不会记录用户输过的值。
<input id="name" autocomplete="off">备注说明:
1、浏览器中的表单会记录刚填完的input数据,为防止用户信息泄露,可以在input中加入autocomplete=“off”,也可以在form表单中加入autocomplete,可以防止表单记录填过的表单数据,不会记录用户输过的值。
2、autocomplete 属性适用于 <form>,以及下面的 <input> 类型:text, search, url, telephone, email, password, datepickers, range 以及 color。
出现不生效的情况
有时候明明设置了autocomplete="off",但是依然会有自动填充,就是浏览器的策略原因,在caniuse上有关于各个浏览器那种情况下autocomplete="off"无效的描述,具体如下:
Chrome浏览器在用户使用了自动填充功能的情况下,autocomplete="off" 无效。
Safari浏览器在 username,email 和 password文本框的时候,关闭自动填充无效。
Firefox浏览器则是在登录表单中无法使用autocomplete="off"关闭自动提示。
一般而言,我们不需要特意去解决这些问题,如果工作中非要去处理,可以看看下面的2遍文章:
参考一:解决autocomplete=off在Chrome中不起作用的方法
参考二:聊聊:autofill和autocomplete自动填充
方式二、浏览器设置
这里以谷歌浏览器为例,在浏览器地址栏输入:
chrome://settings/autofill
关闭自动填充表单即可(自动填充和密码下面的每一项都可以关闭),这样处理后所有网站下的input框都不会出现历史记录了。
方法三、快捷方式
当已输入过的输入框中,点一下输入框就会自动带出先前所输入过的文字,接着当要删除某个文字记录时,只需将滑鼠滑到上方,再按Shift+fn+Del键(MAC)/Shift+Del键(Win),就可将它删除。这样就可将先前的文字记录给一一的删除!
本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!