如何在主要浏览器中禁用特定输入(或表单字段)的自动完成?
当前回答
Chrome的解决方案是在输入类型密码中添加autocomplete=“new password”。请检查以下示例。
例子:
<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>
如果Chrome找到一个密码类型的框,它总是自动完成数据,这足以表明该框的自动完成=“新密码”。
这对我很有用。
注意:使用F12确保更改生效。很多时候,浏览器都会将页面保存在缓存中,这给我一个不好的印象,认为它不起作用,但浏览器实际上并没有带来更改。
其他回答
当我自己尝试时,事情已经改变了,旧的答案不再有效。
我确信它会奏效。我在Chrome、Edge和Firefox中测试了这一功能,它确实做到了这一点。你也可以尝试一下,告诉我们你的经历。
set the autocomplete attribute of the password input element to "new-password"
<form autocomplete="off">
....other element
<input type="password" autocomplete="new-password"/>
</form>
这是根据MDN
如果您正在定义一个用户管理页面,用户可以在该页面中为另一个人指定新密码,因此您希望防止自动填充密码字段,则可以使用autocomplete=“新密码”
这是一个提示,哪些浏览器不需要遵守。然而,由于这个原因,现代浏览器已经停止使用autocomplete=“new password”自动填充<input>元素。
简易黑客
使输入为只读
<input type="text" name="name" readonly="readonly">
超时后删除只读
$(function() {
setTimeout(function() {
$('input[name="name"]').prop('readonly', false);
}, 50);
});
我已经解决了在页面加载后放置此代码的问题:
<script>
var randomicAtomic = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
$('input[type=text]').attr('autocomplete',randomicAtomic);
</script>
有很多答案,但大多数都是破解或某种变通方法。
这里有三个案例。
案例一:如果这是你的标准登录表单。无论如何关闭它都可能是不好的。如果你真的需要这样做,请仔细考虑。用户习惯于浏览器记住和存储密码。在大多数情况下,你不应该改变这种标准行为。
如果你仍然想这样做,请参阅案例三
案例二:如果这不是您的常规登录表单,但输入的名称或id属性不是“像”电子邮件、登录名、用户名、用户名和密码。
Use
<input type="text" name="yoda" autocomplete="off">
案例三:如果这不是您的常规登录表单,但输入的名称或id属性是“类似”电子邮件、登录名、用户名、用户名和密码。
例如:登录,abc_login,密码,some_password,password_field。
所有浏览器都带有密码管理功能,可以记住密码或建议使用更强的密码。他们就是这样做的。
然而,假设你是一个网站的管理员,可以创建用户并设置他们的密码。在这种情况下,您不希望浏览器提供这些功能。
在这种情况下,autocomplete=“off”将不起作用。使用autocomplete=“新密码”
<input type="text" name="yoda" autocomplete="new-password">
有用链接:
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion
<input type="text" name="attendees" id="autocomplete-custom-append">
<script>
/* AUTOCOMPLETE */
function init_autocomplete() {
if (typeof ($.fn.autocomplete) === 'undefined') {
return;
}
// console.log('init_autocomplete');
var attendees = {
1: "Shedrack Godson",
2: "Hellen Thobias Mgeni",
3: "Gerald Sanga",
4: "Tabitha Godson",
5: "Neema Oscar Mracha"
};
var countriesArray = $.map(countries, function (value, key) {
return {
value: value,
data: key
};
});
// initialize autocomplete with custom appendTo
$('#autocomplete-custom-append').autocomplete({
lookup: countriesArray
});
};
</script>
推荐文章
- 使伸缩项目正确浮动
- 形式内联内的形式水平在twitter bootstrap?
- 自定义元素在HTML5中有效吗?
- 如何触发自动填充在谷歌Chrome?
- 创建圈div比使用图像更容易的方法?
- 为什么Chrome浏览器不正确地确定页面是在不同的语言,并提供翻译?
- 在网页上用鼠标模拟震颤(例如帕金森病)?
- Bootstrap抛出Uncaught错误:Bootstrap的JavaScript需要jQuery
- 如何改变文本区域的边框颜色:焦点
- 我如何设置背景颜色为文本的宽度,而不是整个元素的宽度,使用CSS?
- 如何删除和清除所有的本地存储数据
- 强制打开“另存为…”弹出打开文本链接点击PDF在HTML
- 如何修改标签文本?
- 在HTML中还有其他有用的空格码吗,比如半空格的 , em-spaces, en-spaces等等?
- 输入触发器按钮单击