如何在主要浏览器中禁用特定输入(或表单字段)的自动完成?
当前回答
将输入保留为文本类型并隐藏。在DOMContentLoaded上,调用一个函数来更改密码类型并显示字段,延迟1秒。
document.addEventListener('DOMContentLoaded',changeInputsType);函数更改InputsType(){setTimeout(函数){$(/*selector*/).prop(“type”,“password”).show();}, 1000);}
其他回答
(它在2021适用于Chrome(v88、89、90)、Firefox、Brave和Safari。)这里已经写过的旧答案将经过反复尝试,但大多数他们没有链接到任何官方文档或Chrome对此的评论课题
问题中提到的问题是因为Chrome的自动填充功能,这是Chrome在这个bug链接中的立场-问题468153:autocomplete=off在非登录INPUT元素上被忽略,注释160
简单地说,有两种情况-
[案例1]:您的输入类型不是密码。在这种情况下,解决方案很简单,有三个步骤。将name属性添加到输入name不应以电子邮件或用户名之类的值开头。否则Chrome仍然会显示下拉列表。例如,name=“emailToDelete”显示下拉列表,但name=“to delete email”不显示。这同样适用于autocomplete属性。添加autocomplete属性,并添加一个对您有意义的值,如新字段名
它将看起来像这样,并且在您的余生中不会再次看到该输入的自动填充-
<input type="text/number/something-other-than-password" name="x-field-1" autocomplete="new-field-1" />
[案例2]:输入类型为密码好吧,在这种情况下,无论您的试用如何,Chrome都会向您显示管理密码/使用现有密码的下拉列表。Firefox也会做一些类似的事情,其他所有主要浏览器也是如此。2.在这种情况下,如果你真的想阻止用户看到下拉列表来管理密码/看到安全生成的密码,你就必须使用JS来切换输入类型,正如这个问题的其他答案中提到的那样。
2有关关闭自动完成的详细MDN文档-如何关闭表单自动完成
我刚刚遇到了这个问题,并尝试了几次失败,但这一次对我有效(在MDN上找到):
在某些情况下,浏览器将继续建议自动完成值即使autocomplete属性设置为off。这是意外的对于开发人员来说,这种行为可能非常令人困惑。真正的诀窍强制无完成是将随机字符串分配给属性像这样:
autocomplete="nope"
您可以在输入中使用它。
例如
<input type=text name="test" autocomplete="off" />
最佳解决方案:
防止自动完成用户名(或电子邮件)和密码:
<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">
阻止自动完成字段:
<input type="text" name="field" autocomplete="nope">
说明:autocomplete在<input>中继续工作,autocomplete=“off”不工作,但您可以将off更改为随机字符串,如nope。
工作地点:
铬:49、50、51、52、53、54、55、56、57、58、59、60、61、62、63和64Firefox:44、45、46、47、48、49、50、51、52、53、54、55、56、57和58
Firefox 30忽略密码的autocomplete=“off”,而是选择提示用户密码是否应存储在客户端上。请注意2014年5月5日的以下评论:
密码管理器始终提示是否要保存密码。未经用户许可,密码不会保存。我们是继IE和Chrome之后第三个实现这一改变的浏览器。
根据Mozilla开发者网络文档,布尔表单元素属性autocomplete防止表单数据在旧浏览器中缓存。
<input type="text" name="foo" autocomplete="off" />
推荐文章
- 使伸缩项目正确浮动
- 形式内联内的形式水平在twitter bootstrap?
- 自定义元素在HTML5中有效吗?
- 如何触发自动填充在谷歌Chrome?
- 创建圈div比使用图像更容易的方法?
- 为什么Chrome浏览器不正确地确定页面是在不同的语言,并提供翻译?
- 在网页上用鼠标模拟震颤(例如帕金森病)?
- Bootstrap抛出Uncaught错误:Bootstrap的JavaScript需要jQuery
- 如何改变文本区域的边框颜色:焦点
- 我如何设置背景颜色为文本的宽度,而不是整个元素的宽度,使用CSS?
- 如何删除和清除所有的本地存储数据
- 强制打开“另存为…”弹出打开文本链接点击PDF在HTML
- 如何修改标签文本?
- 在HTML中还有其他有用的空格码吗,比如半空格的 , em-spaces, en-spaces等等?
- 输入触发器按钮单击