如何在主要浏览器中禁用特定输入(或表单字段)的自动完成?
当前回答
非常简单的解决方案只需更改标签名称和字段名称,而不是更通用的名称,例如:名称、联系人、电子邮件。使用“邮件收件人”而不是“电子邮件”。浏览器忽略这些字段的自动完成。
其他回答
为了解决这个问题,我使用了一些CSS技巧和以下工作。
input {
text-security:disc;
-webkit-text-security:disc;
-mox-text-security:disc;
}
请阅读本文了解更多详情。
对于React,您可以尝试将此代码放在表单下面或密码输入上面,或者放在电子邮件和密码输入之间
export const HackRemoveBrowsersAutofill = () => (
<>
<input type="email" autoComplete="new-password" style={ { display: 'none' } } />
<input type="password" autoComplete="new-password" style={ { display: 'none' } } />
</>
)
示例之一:
<input type="email"/>
<HackRemoveBrowsersAutofill/>
<input type="password"/>
最简单的答案是
<input autocomplete=“on | off”>
但请记住浏览器支持。当前,支持自动完成属性
铬17.0及最新版本IE 5.0及最新版本Firefox 4.0及最新版本Safari 5.2及最新版本Opera 9.6及最新版本
将输入保留为文本类型并隐藏。在DOMContentLoaded上,调用一个函数来更改密码类型并显示字段,延迟1秒。
document.addEventListener('DOMContentLoaded',changeInputsType);函数更改InputsType(){setTimeout(函数){$(/*selector*/).prop(“type”,“password”).show();}, 1000);}
如果您的问题是自动填写密码字段,那么您可能会发现这很有用。。。
我们在网站的几个领域遇到了这个问题,在这些领域中,业务部门希望重新查询用户的用户名和密码,特别是出于合同原因,不希望自动填充密码。我们发现,最简单的方法是输入一个假密码字段,以便浏览器查找和填充,而真实密码字段保持不变。
<!-- This is a fake password input to defeat the browser's autofill behavior -->
<input type="password" id="txtPassword" style="display:none;" />
<!-- This is the real password input -->
<input type="password" id="txtThisIsTheRealPassword" />
请注意,在Firefox和IE中,将任何类型的密码输入放在实际输入之前就足够了,但Chrome识破了这一点,并迫使我实际命名假密码输入(通过给它一个明显的密码id),以使其“咬”。我使用了一个类来实现样式,而不是使用嵌入样式,所以如果由于某种原因,上面的方法不起作用,请尝试这样做。
推荐文章
- 使伸缩项目正确浮动
- 形式内联内的形式水平在twitter bootstrap?
- 自定义元素在HTML5中有效吗?
- 如何触发自动填充在谷歌Chrome?
- 创建圈div比使用图像更容易的方法?
- 为什么Chrome浏览器不正确地确定页面是在不同的语言,并提供翻译?
- 在网页上用鼠标模拟震颤(例如帕金森病)?
- Bootstrap抛出Uncaught错误:Bootstrap的JavaScript需要jQuery
- 如何改变文本区域的边框颜色:焦点
- 我如何设置背景颜色为文本的宽度,而不是整个元素的宽度,使用CSS?
- 如何删除和清除所有的本地存储数据
- 强制打开“另存为…”弹出打开文本链接点击PDF在HTML
- 如何修改标签文本?
- 在HTML中还有其他有用的空格码吗,比如半空格的 , em-spaces, en-spaces等等?
- 输入触发器按钮单击