对任何想要解决这个问题的人来说，我终于明白了。

如果页面是HTML5页面(我使用XHTML)， Chrome只服从autocomplete="off"。

我把我的页面转换成HTML5，问题就消失了(捂脸)。

似乎Chrome现在忽略autocomplete="off"，除非它是在<form autocomplete="off">标签。

我发现这个解决方案是最合适的:

function clearChromeAutocomplete()
{
// not possible, let's try:
if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0)
{
document.getElementById('adminForm').setAttribute('autocomplete', 'off');
setTimeout(function () {
document.getElementById('adminForm').setAttribute('autocomplete', 'on');
}, 1500);
}
}

它必须在dom就绪后加载，或者在表单呈现后加载。

更新

现在Chrome似乎忽略了style="display: none;"或style="visibility: hidden;属性。

你可以把它改成这样:

<input style="opacity: 0;position: absolute;">
<input type="password" style="opacity: 0;position: absolute;">

根据我的经验，Chrome只自动完成第一个<input type="password">和之前的<input>。所以我添加了:

<input style="display:none">
<input type="password" style="display:none">

到<form>的顶部，这个案子就解决了。

很多讨论，这是好事还是坏事?你的观点是什么?

在chrome v. 34之后，在<form>标签上设置autocomplete="off"不起作用

我做这些改变是为了避免这种恼人的行为:

1. 删除密码输入中的name和id
2. 在输入中放入一个类(例如:passwordInput)

(到目前为止，Chrome不会把保存的密码输入，但形式现在是破碎的)

最后，为了让表单工作，当用户点击提交按钮时，或者当你想触发表单提交时，运行以下代码:

var sI = $(".passwordInput")[0];
$(sI).attr("id", "password");
$(sI).attr("name", "password");

在我的例子中，我曾经在密码输入中使用id="password" name="password"，所以我在触发提交之前把它们放回去。

看到chrome忽略了autocomplete="off"，我用一个愚蠢的方法解决它，这是使用“假输入”来欺骗chrome填充它，而不是填充“真实的”一个。

例子:

<input type="text" name="username" style="display:none" value="fake input" />
<input type="text" name="username" value="real input"/>

Chrome将填充“假输入”，当提交时，服务器将采取“真实输入”的值。

告诉Chrome这是一个新的密码输入，它不会提供旧的作为自动完成的建议:

<input type="password" name="password" autocomplete="new-password">

autocomplete="off"不可行是因为设计上的决定——大量研究表明，如果用户可以将密码存储在浏览器或密码管理器中，他们就会有更长的时间和更难破解密码。

autocomplete 已经改变了规范，现在支持各种值，使登录表单易于自动完成:

<!-- Auto fills with the username for the site, even though it's email format -->
<input type="email" name="email" autocomplete="username">


<!-- current-password will populate for the matched username input  -->
<input type="password" autocomplete="current-password" />

如果你不提供这些Chrome仍然试图猜测，当它做它忽略autocomplete="off"。

解决方案是密码重置表单也存在autocomplete值:

<label>Enter your old password:
<input type="password" autocomplete="current-password" name="pass-old" />
</label>
<label>Enter your new password:
<input type="password" autocomplete="new-password" name="pass-new" />
</label>
<label>Please repeat it to be sure:
<input type="password" autocomplete="new-password" name="pass-repeat" />
</label>

你可以使用这个autocomplete="new-password"标志告诉Chrome浏览器不要猜测密码，即使它已经为这个网站存储了一个。

Chrome还可以直接使用凭证API来管理网站的密码，这是一个标准，最终可能会得到普遍支持。

虽然我同意自动补全应该是用户的选择，但有时Chrome对它过于热心(其他浏览器可能也是如此)。例如，具有不同名称的密码字段仍然自动填充已保存的密码，而前一个字段仍然填充用户名。当表单是web应用程序的用户管理表单，而你不想自动填充以填充你自己的凭证时，这尤其糟糕。

Chrome完全忽略autocomplete="off"现在。虽然JS技巧可能很有效，但我发现了一种简单的方法:

将密码字段的值设置为控制字符8 (PHP中的"\x08"或HTML中的)。这将停止Chrome自动填充字段，因为它有一个值，但没有实际的值输入，因为这是退格字符。

是的，这仍然是一个黑客，但它为我工作。YMMV。

我用另一种方法解决了。你可以试试这个。

<input id="passfld" type="text" autocomplete="off" />
<script type="text/javascript">
// Using jQuery
$(function(){
setTimeout(function(){
$("input#passfld").attr("type","password");
},10);
});




// or in pure javascript
window.onload=function(){
setTimeout(function(){
document.getElementById('passfld').type = 'password';
},10);
}
</script>

浏览器不关心自动完成=关闭自动，甚至填充凭据到错误的文本字段?

我通过将密码字段设置为只读并激活它来修复它，当用户单击进入它或使用tab键到该字段时。

修复浏览器自动填充:只读和设置可写的焦点(通过鼠标点击和标签通过字段)

 <input type="password" readonly
onfocus="$(this).removeAttr('readonly');"/>

<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
this.removeAttribute('readonly');
// fix for mobile safari to show virtual keyboard
this.blur();    this.focus();  }" />

现场演示https://jsfiddle.net/danielsuess/n0scguv6/

/ / UpdateEnd

顺便说一下，更多的信息在我的观察中:

有时我在Chrome和Safari上注意到这种奇怪的行为，当在同样的形式。中有密码字段时，我猜浏览器会寻找密码字段来插入您保存的凭据。然后是DOM中的自动填充用户名到最近的文本输入字段，出现在密码字段之前(只是根据观察猜测)。由于浏览器是最后一个实例，你不能控制它，有时即使autocomplete=off也不会阻止填写凭证输入错误的字段，但不是用户或昵称字段。

我提出了以下解决方案，查询所有字段的属性autocomple="off"，然后将其值设置为单个空间，然后设置一个约200ms的定时器，并将值设置回一个空字符串。

例子:

// hack to prevent auto fill on chrome
var noFill = document.querySelectorAll("input[autocomplete=off]");


noFill.forEach(function(el) {
el.setAttribute("value", " ");
setTimeout(function() {
el.setAttribute("value", "");
}, 200);
});

我选择200毫秒作为计时器，因为经过一些实验，200毫秒似乎是我的电脑上chrome放弃尝试自动完成字段所需的时间。我很乐意听到其他时间对其他人来说似乎更好。

目前的解决方案是使用type="search"。谷歌不会对输入的搜索类型应用自动填充。

看到:# EYZ0

更新04/04/2016:看起来这是固定的!看到# EYZ1

作为Chrome 42，没有解决方案/黑客在这个线程(作为2015-05-21T12:50:23+00:00)工作为禁用一个单独的字段或整个表单的自动完成。

我发现你实际上只需要在你的表单中插入一个虚拟的电子邮件字段(你可以用display: none隐藏它)，在其他字段之前防止自动完成。我假设chrome存储某种形式的签名与每个自动完成字段，包括另一个电子邮件字段破坏这个签名，防止自动完成。

<form action="/login" method="post">
<input type="email" name="fake_email" style="display:none" aria-hidden="true">
<input type="email" name="email">
<input type="password" name="password">
<input type="submit">
</form>

好消息是，因为“表单签名”被破坏了，所以没有一个字段是自动完成的，所以在提交之前不需要JS来清除假字段。

旧的回答:

我发现唯一可行的方法是在真正的字段之前插入两个电子邮件和密码类型的虚拟字段。你可以将它们设置为display: none来隐藏它们(忽略这些字段是不够聪明的):

<form action="/login" method="post">
<input type="email" name="fake_email" style="display:none" aria-hidden="true">
<input type="password" name="fake_password" style="display:none" aria-hidden="true">
<input type="email" name="email">
<input type="password" name="password">
<input type="submit">
</form>

不幸的是，字段必须在表单中(否则两组输入都是自动填充的)。因此，为了真正忽略假字段，你需要在form submit上运行一些JS来清除它们:

form.addEventListener('submit', function() {
form.elements['fake_email'].value = '';
form.elements['fake_password'].value = '';
});

从上面可以注意到，用Javascript清除值可以覆盖自动完成。因此，如果失去适当的行为与JS禁用是可以接受的，你可以简化这一切与JS自动完成“polyfill”Chrome:

(function(document) {


function polyfillAutocomplete(nodes) {


for(var i = 0, length = nodes.length; i < length; i++) {


if(nodes[i].getAttribute('autocomplete') === 'off') {


nodes[i].value = '';
}
}
}


setTimeout(function() {


polyfillAutocomplete(document.getElementsByTagName('input'));
polyfillAutocomplete(document.getElementsByTagName('textarea'));


}, 1);


})(window.document);

将& lt;输入类型=“text"祝辞改为& lt;输入类型=“search"自动完成=“off"比;

仅此而已。保留下面的答案作为怀旧。

为了一个可靠的解决方案，你可以添加以下代码到你的布局页面:

<div style="display: none;">
<input type="text" id="PreventChromeAutocomplete"
name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>

Chrome尊重autocomplete=off只有当至少有一个其他输入元素的形式与任何其他自动完成值。

这对密码字段不起作用——这些在Chrome中的处理方式非常不同。更多细节请参见https://code.google.com/p/chromium/issues/detail?id=468153。

更新:Bug关闭为“无法修复”;由Chromium团队2016年3月11日。参见我最初提交的错误报告中的最后评论，以获得完整的解释。TL;DR:使用语义自动补全属性，如autocomplete="新街道地址"以避免Chrome执行自动填充。

隐藏的输入元素技巧似乎仍然有效(Chrome 43)，以防止自动填充，但要记住的一件事是Chrome将尝试基于占位符标记自动填充。您需要将隐藏输入元素的占位符与您试图禁用的输入的占位符匹配。

在我的情况下，我有一个字段的占位符文本“城市或Zip”，我正在使用谷歌地方自动完成。它似乎试图自动填写，就好像它是一个地址表单的一部分。直到我在隐藏元素上放置了与实际输入相同的占位符，这个技巧才起作用:

<input style="display:none;" type="text" placeholder="City or Zip" />
<input autocomplete="off" type="text" placeholder="City or Zip" />

现代的方法

简单地让您的输入readonly，并集中，删除它。这是一种非常简单的方法，浏览器不会填充readonly输入。因此，此方法被接受，并且永远不会被将来的浏览器更新覆盖。

<input type="text" onfocus="this.removeAttribute('readonly');" readonly />

下一部分是可选的。相应地设置您的输入样式，使它看起来不像readonly输入。

input[readonly] {
cursor: text;
background-color: #fff;
}

WORKING EXAMPLE

我遇到过类似的问题，输入字段要么取名字，要么取电子邮件。我设置autocomplete=“关闭”，但Chrome仍然强制建议。事实证明，这是因为占位符文本中有“姓名”和“电子邮件”这两个词。

例如

<input type="text" placeholder="name or email" autocomplete="off" />

我通过在占位符中的单词中放入零宽度的空格来解决这个问题。没有更多的Chrome自动完成。

<input type="text" placeholder="nam&#8203;e or emai&#8203;l" autocomplete="off" />

在尝试了所有的解决方案后，这里是什么似乎是chrome版本:45，与表单有密码字段:

 jQuery('document').ready(function(){
//For disabling Chrome Autocomplete
jQuery( ":text" ).attr('autocomplete','pre'+Math.random(0,100000000));
});

不要使用自动完成=“关闭”，而是使用自动完成= " false ";)

来自:# EYZ0

将输入类型属性更改为type="search"。

谷歌不会对输入的搜索类型应用自动填充。

为了防止自动补全，只需设置一个空白作为输入值:

<input type="text" name="name" value="  ">

好吧，有点晚了，但似乎有一点关于autocomplete应该和不应该如何工作的误解。根据HTML规范，用户代理(在这种情况下Chrome)可以覆盖autocomplete:

https://www.w3.org/TR/html5/forms.html#autofilling-form-controls:-the-autocomplete-attribute

用户代理可以允许用户覆盖元素的自动填充字段名，例如将其从"off"“;知道;不顾页面作者的反对，允许值被记住并预填充，或者总是“关闭”，从不记住值。但是，用户代理不应该允许用户简单地覆盖自动填充字段名。“;知道;或者其他值，因为无论站点的首选项如何，如果始终记住所有值，则对用户的安全性有重大影响。

所以在Chrome的例子中，开发者基本上说“我们将把这个留给用户来决定他们是否想要autocomplete工作。”如果你不想要它，就不要在你的浏览器中启用它。

然而，在我看来，这对他们来说似乎有点过于热情了，但事实就是如此。规范还讨论了这样做的潜在安全影响:

“off"关键字表示控件的输入数据特别敏感(例如核武器的激活码);或者它是一个永远不会被重用的值(例如银行登录的一次性键)，因此用户必须每次都显式地输入数据，而不是能够依靠UA为他预先填充值;或者文档提供了自己的自动补全机制，不希望用户代理提供自动补全值。

所以，在经历了和其他人一样的挫折之后，我找到了一个适合我的解决方案。这与autocomplete="false"的答案相似。

Mozilla的一篇文章正是针对这个问题:

https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

在某些情况下，即使autocomplete属性被设置为关闭，浏览器也会继续建议自动补全值。这种出乎意料的行为可能会让开发人员感到困惑。真正强制不完成的技巧是为属性分配一个随机字符串

所以下面的代码应该工作:

autocomplete="nope"

以下每一项也应如此:

autocomplete="false"
autocomplete="foo"
autocomplete="bar"

我看到的问题是浏览器代理可能足够聪明，可以学习autocomplete属性，并在下次看到表单时应用它。如果它确实这样做了，我所能看到的解决问题的唯一方法是在生成页面时动态更改autocomplete属性值。

值得一提的一点是，许多浏览器会忽略登录字段(用户名和密码)的autocomplete设置。正如Mozilla文章所述:

因此，许多现代浏览器不支持autocomplete="off"用于登录字段。

• 如果一个网站设置autocomplete="off"对于表单，并且表单包含用户名和密码输入字段，那么浏览器仍然会提供记住这个登录，如果用户同意，浏览器将在用户下次访问此页面时自动填充这些字段。
• 如果一个网站设置autocomplete="off"对于用户名和密码输入字段，浏览器仍然会提供记住该登录，如果用户同意，浏览器将在用户下次访问此页面时自动填充这些字段。

这是Firefox(从38版开始)、谷歌Chrome(从34版开始)和Internet Explorer(从11版开始)的行为。

最后是关于属性是属于form元素还是input元素的一些信息。规范再次给出了答案:

如果省略了autocomplete属性，则使用与元素的表单所有者的autocomplete属性状态对应的默认值(要么"on"或“off")。如果没有表单所有者，则值" onquot;使用。

所以。把它放在表单上应该适用于所有输入字段。将它放在单个元素上应该只应用于该元素(即使表单上没有)。如果根本没有设置autocomplete，则默认为on。

总结

禁用整个表单的autocomplete:

<form autocomplete="off" ...>

或者如果你动态地需要这样做:

<form autocomplete="random-string" ...>

在单个元素上禁用autocomplete(无论是否存在表单设置)

<input autocomplete="off" ...>

或者如果你动态地需要这样做:

<input autocomplete="random-string" ...>

请记住，某些用户代理甚至可以覆盖您禁用autocomplete的最艰难的尝试。

直到上周，以下两种解决方案似乎都适用于Chrome、IE和Firefox。但随着Chrome 48版的发布(仍然是49版)，它们不再适用:

1. 表格顶部有以下内容:

<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>

2. 密码输入元素:

   自动完成=“关闭”< / p >

因此，为了快速解决这个问题，我首先尝试使用一个主要的hack，即最初将密码输入元素设置为禁用，然后在document ready函数中使用setTimeout再次启用它。

setTimeout(function(){$('#PasswordData').prop('disabled', false);}, 50);

但这似乎太疯狂了，我做了更多的搜索，在禁用Chrome浏览器自动填充中找到了@tibalts的答案。他的答案是在密码输入中使用autocomplete="new-password"，这似乎在所有浏览器上都可以工作(在这个阶段，我保留了上面的修复程序1)。

我发布这个答案是为了给这个问题带来一个更新的解决方案。 我目前使用的是Chrome 49，没有给出的答案。 我也在寻找一个解决方案与其他浏览器和以前的版本

把这些代码放在表单的开头

<div style="display: none;">
<input type="text" autocomplete="new-password">
<input type="password" autocomplete="new-password">
</div>

然后，对于您的真实密码字段，使用

<input type="password" name="password" autocomplete="new-password">

如果这不再工作，或如果您遇到其他浏览器或版本的问题，请注释此答案。

批准:

• Chrome浏览器:49
• Firefox: 44,45
• 边缘:25
• Internet Explorer: 11

我刚刚更新到Chrome 49和迪奥戈·熙德的解决方案不再工作了。

我做了一个不同的工作，在页面加载后在运行时隐藏和删除字段。

Chrome现在忽略了最初的解决方案，将凭据应用到第一个显示 type="password"字段和它之前的type="text"字段，所以我已经隐藏了两个字段使用CSS visibility: hidden;

<!-- HTML -->
<form>
<!-- Fake fields -->
<input class="chromeHack-autocomplete">
<input type="password" class="chromeHack-autocomplete">


<input type="text" placeholder="e-mail" autocomplete="off" />
<input type="password" placeholder="Password" autocomplete="off" />
</form>


<!-- CSS -->
.chromeHack-autocomplete {
height: 0px !important;
width: 0px !important;
opacity: 0 !important;
padding: 0 !important; margin: 0 !important;
}


<!--JavaScript (jQuery) -->
jQuery(window).load(function() {
$(".chromeHack-autocomplete").delay(100).hide(0, function() {
$(this).remove();
});
});

我知道这看起来不是很优雅，但很有效。

看起来这是固定的!看到# EYZ0

在Chrome 48+使用这个解决方案:

1. 将假字段放在真实字段之前:

   <form autocomplete="off">
   <input name="fake_email"    class="visually-hidden" type="text">
   <input name="fake_password" class="visually-hidden" type="password">
   
   
   <input autocomplete="off" name="email"    type="text">
   <input autocomplete="off" name="password" type="password">
   </form>
   

2. Hide fake fields:

   .visually-hidden {
   margin: -1px;
   padding: 0;
   width: 1px;
   height: 1px;
   overflow: hidden;
   clip: rect(0 0 0 0);
   clip: rect(0, 0, 0, 0);
   position: absolute;
   }
   

3. You did it!

Also this will work for older versions.

防止用户名(或电子邮件)和密码自动完成:

<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仍然适用于# eyz1，尽管有autocomplete="off"，但您可以将off更改为随机字符串，如nope。

其他“解决方案”禁用字段的自动补全(这不是正确的方法，但它是有效的):

1.

HTML:

<input type="password" id="some_id" autocomplete="new-password">

JS (onload):

(function() {
var some_id = document.getElementById('some_id');
some_id.type = 'text';
some_id.removeAttribute('autocomplete');
})();

或者使用jQuery:

$(document).ready(function() {
var some_id = $('#some_id');
some_id.prop('type', 'text');
some_id.removeAttr('autocomplete');
});

2.

HTML:

<form id="form"></form>

JS (onload):

(function() {
var input = document.createElement('INPUT');
input.type = 'text';
document.getElementById('form').appendChild(input);
})();

或者使用jQuery:

$(document).ready(function() {
$('<input>', {
type: 'text'
}).appendTo($('#form'));
});

使用jQuery添加多个字段:

function addField(label) {
var div = $('<div>');
var input = $('<input>', {
type: 'text'
});
  

if(label) {
var label = $('<label>', {
text: label
});
    

label.append(input);
div.append(label);
} else {
div.append(input);
}
  

div.appendTo($('#form'));
}


$(document).ready(function() {
addField();
addField('Field 1: ');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form"></form>

适用于:

• 铬:49 +

• Firefox: 44 +

你可以使用下面的概念来实现AutoComplete='false' chrome以及其他浏览器。取一个虚拟输入类型，它的不透明度为0。默认chrome浏览器已经触发第一个已经隐藏。

<input style="opacity: 0; position: absolute; z-index: -1;" name="email">
<input type="search" name="email" class="form-control" autocomplete="new-email" id="email">

我刚刚尝试了下面的方法，它似乎在Chrome 53上起了作用——当输入密码字段时，它还禁用了“使用密码用于:”下拉菜单。

简单地设置你的密码输入类型为text，然后添加onfocus处理程序(内联或通过jQuery/香草JS)来设置类型为password:

onfocus="this.setAttribute('type','password')"

或者更好:

onfocus="if(this.getAttribute('type')==='text') this.setAttribute('type','password')"

您可以使用autocomplete="new-password"

<input type="email" name="email">
<input type="password" name="password" autocomplete="new-password">

适用于:

• Chrome: 53,54,55
• 火狐:48、49、50

在form标签后添加这个:

<form>
<div class="div-form">
<input type="text">
<input type="password" >
</div>

添加到你的css文件:

.div-form{
opacity: 0;
}

autocomplete=off在现代浏览器中很大程度上被忽略了——主要是由于密码管理器等。

您可以尝试添加autocomplete="new-password"，它不是所有浏览器都完全支持，但它可以在一些浏览器上工作

当使用像jQuery UI的自动完成这样的小部件时，请确保它没有添加/更改自动完成属性为关闭。在使用它时，我发现这是正确的，并且会破坏您为覆盖任何浏览器字段缓存所做的任何工作。确保拥有唯一的name属性，并在小部件初始化后强制使用唯一的自动完成属性。下面是一些关于如何在你的情况下工作的提示。

<?php $autocomplete = 'off_'.time(); ?>
<script>
$('#email').autocomplete({
create: function( event, ui ) {
$(this).attr('autocomplete','<? echo $autocomplete; ?>');
},
source: function (request, response) { //your code here },
focus: function( event, ui ) { //your code here },
select: function( event, ui ) { //your code here },
});
</script>
<input type="email" id="email" name="email_<? echo $autocomplete; ?>" autocomplete="<? echo $autocomplete; ?>" />

我使用Chrome -版本64.0.3282.140(正式版本)(64位)，并使用以下代码和表单名称，它适用于我。

<form name="formNameHere">....</form>
<script type="text/javascript">
setTimeout(function(){
document.formNameHere.reset();
},500);
</script>

除了给它一个自动补全的假字段外，所有的解决方案都不起作用。我做了一个React组件来解决这个问题。

import React from 'react'


// Google Chrome stubbornly refuses to respect the autocomplete="off" HTML attribute so
// we have to give it a "fake" field for it to autocomplete that never gets "used".


const DontBeEvil = () => (
<div style=\{\{ display: 'none' }}>
<input type="text" name="username" />
<input type="password" name="password" />
</div>
)


export default DontBeEvil

始终有效的解决方案

我用随机字符的使用解决了谷歌Chrome无休止的战斗。当你总是用随机字符串渲染自动补全时，它永远不会记住任何东西。

<input name="name" type="text" autocomplete="rutjfkde">

希望对其他人有所帮助。

2022年更新:

Chrome做了这个改进:autocomplete="new-password"，这将解决它，但我不确定，如果Chrome在一段时间后再次改变它的不同功能。

我把这种方法称为大锤方法，但它似乎在我尝试过的所有其他方法都失败的地方起了作用:

<input autocomplete="off" data-autocomplete-ninja="true" name="fa" id="fa" />

注意:输入名称和id属性不应该包含任何会给浏览器提示数据是什么的东西，否则这个解决方案将无法工作。例如，我使用“fa”而不是“FullAddress”。

和下面的脚本页面加载(这个脚本使用JQuery):

$("[data-autocomplete-ninja]").each(function () {
$(this).focus(function () {
$(this).data("ninja-name", $(this).attr("name")).attr("name", "");
}).blur(function () {
$(this).attr("name", $(this).data("ninja-name"));
});
});

上面的解决方案应该可以防止浏览器自动填充从其他表单收集的数据，或者从同一表单上以前提交的数据。

基本上，当输入处于焦点中时，我删除了name属性。只要在元素处于焦点时不做任何需要name属性的事情，比如根据元素名称使用选择器，这个解决方案应该是无害的。

autocomplete="off"现在工作了，所以你可以只做以下工作:

<input id="firstName2" name="firstName2" autocomplete="off">

在当前的Chrome 70以及从Chrome 62开始的所有版本中测试。

# EYZ0:

• 顶部input具有自动完成工作
• 底部 input通过添加autocomplete="off"来自动完成禁用

对于这个问题，我使用了这个css解决方案。这对我很有用。

input{
text-security:disc !important;
-webkit-text-security:disc !important;
-moz-text-security:disc !important;
}

不知道为什么这在我的情况下工作，但在chrome我使用autocomplete="none"和chrome停止建议地址为我的文本字段。

Autocomplete="Off"不起作用了。

试着使用一个随机字符串而不是"Off"，例如Autocomplete="NoAutocomplete"

我希望这能有所帮助。

autocomplete="off"通常是工作的，但并不总是如此。它取决于输入字段的name。像“地址”，“电子邮件”，“姓名”这样的名称将被自动补全(浏览器认为他们帮助用户)，当像“代码”，“pin”这样的字段将不会被自动补全(如果设置了autocomplete="off")

我的问题是-自动完成是混乱的谷歌地址的助手

我通过重命名来修复它

从

<input type="text" name="address" autocomplete="off">

来

<input type="text" name="the_address" autocomplete="off">

铬71测试。

我在我的表单中的一个搜索字段也有类似的问题。autocomplete= "false"和autocomplete= "off"都不适合我。原来，当你有aria-label属性在input元素被设置为city或address或类似的东西，chrome覆盖你所有的设置和显示自动完成无论如何

所以修复我所做的是删除city部分从aria标签，并提出了一个不同的值。最后自动完成停止显示

setTimeout(()=>{ele.type="password"},3000)

或者通过事件改变类型:

ele.oninput=function(){ele.type="password"}

我设法禁用了利用这条规则的自动合成:

不是密码，但应该隐藏的字段，例如credit 卡号，也可能有type="password"属性，但是应该 包含相关的自动补全属性，例如"cc-number"或 “cc-csc"。 # EYZ0 < / p >

<input id="haxed" type="password" autocomplete="cc-number">

然而，随之而来的是巨大的责任:)

不要试图欺骗浏览器密码管理器(或内置于 浏览器，或外部)的设计是为了简化用户体验。 插入假字段，使用错误的自动补全属性或 利用现有密码管理器的弱点

Chrome一直在改变它在每个版本上处理自动完成的方式，我提出的方式是，使字段只读和onclick/focus使它非只读。试试这个jQuery片段。

jQuery(document).ready(function($){
//======fix for autocomplete
$('input, :input').attr('readonly',true);//readonly all inputs on page load, prevent autofilling on pageload


$('input, :input').on( 'click focus', function(){ //on input click
$('input, :input').attr('readonly',true);//make other fields readonly
$( this ).attr('readonly',false);//but make this field Not readonly
});
//======./fix for autocomplete
});

我设置autocomplete="off"形式和输入都有效。但可以是片状的。有时它会建议密码或一些保存的登录名+密码选项。但不要提前预约。

Chrome版本:81.0.4044.138

< a href = " https://codepen。io/farukaf/pen/RwrdmeJ" rel="nofollow noreferrer">CodePen . io/farukaf/pen/RwrdmeJ" rel="nofollow noreferrer

<form role="form" method="post" action="#" autocomplete="off">
<label for="login">Login</label><br/>
<input type="text" name="login" id="login" autocomplete="off" />
<br/><br/>
<label for="password">Password</label><br/>
<input type="password" name="password" autocomplete="off" />
<br/><br/>
<input type="submit" name="submit" value="Submit" />
</form>

其他选项:

1. 删除'form'标签…或者在提交之前将其从'div'更改为'form'。
2. 用javascript和一些contentteditable ="true"Fields可以帮你…

通常每隔几个月我就得另找工作。

写一个2020年以上的答案，如果这对任何人都有帮助的话。我尝试了上面的许多组合，但在我的案例中，有一个关键的组合是缺失的。即使我保留了autocomplete="no "一个随机字符串，它没有为我工作，因为我有的名字属性失踪!

so I keep name='password' 并且autocomplete = "new-password"

对于用户名，我保留name="usrid"//不保留包含'user'的字符串

和autocomplete = "new-password"//也一样，所以谷歌停止建议密码(管理密码下拉菜单)

<ion-input [type]="passwordType" name="password" class="input-form-placeholder" formControlName="model_password"
autocomplete="new-password" [clearInput]="showClearInputIconForPassword">
</ion-input>

Some end 2020更新。我尝试了不同网站上的所有老方法。没有一个成功!：-( 然后我发现了这个: 使用
< / p >

<input type="search"/>

自动补全功能消失了!

Chrome 86, FireFox, Edge 87都成功了。

[autocomplete="off"] {
-webkit-text-security: disc;
}

主要目标是从元素中消除type="password"或其他类似的类型属性。

至少，对于2021-01-24这个解决方案是有效的…

< >强2021回答: 可悲的是，唯一有效的东西都是令人作呕的俗气。我的解决方案是在生成前端标记时，在name属性的末尾添加一个动态生成的随机数(例如<input name="postcode-22643"…)

然后需要在服务器端添加一些东西来清理传入的post请求。例如，在NodeJS / Express中，我放入了一个中间件，并使用了一些正则表达式来从收到的post请求中删除数字段。我的是这样的，但我想在其他语言中也会有类似的东西:

const cleanseAutosuggest = function (req, res, next) {
for (const key in req.body) {
if (key.match(/-\d+/)) {
req.body[key.replace(/-\d+/, "")] = req.body[key];
delete req.body[key];
}
}
next();
};


app.post("/submit", cleanseAutosuggest, function (req, res, next) {
...
})

2020年3月

我正面临着这个问题，不幸的是，没有一个解决方案对我有效。所以我用了这个小技巧，效果很好。

<input autocomplete="off" type="password" name="password" id="password" readonly="readonly">


$('#password').on('click', function (event) {
$('#password').removeAttr('readonly');
$('#password').focus();
});


$('#password').on('blur', function (event) {
$('#password').attr('readonly', 'readonly');
});

当你点击密码输入字段，它开始显示建议，但当触发重点输入字段比它不显示建议，所以这就是我如何解决我的问题。

我希望它能帮助到一些人。

[2021年适用于Chrome(v88, 89, 90)， Firefox, Brave, Safari]

旧的答案已经写在这里将适用于试验和错误，但大多数 他们没有链接到任何官方文件或什么Chrome不得不说这一点 事。< / p >

问题中提到的问题是因为Chrome的自动填充功能，这里是Chrome在这个错误链接中的立场- https://bugs.chromium.org/p/chromium/issues/detail?id=468153#c164

简单地说，有两种情况-

• < >强(案例1)< / >强:你的input类型不是password类型。在这种情况下，解决方案很简单，有三个步骤。
  • 添加name属性到input
  • name不应该以电子邮件或用户名这样的值开头，否则Chrome仍然会显示下拉列表。例如，name="emailToDelete"显示下拉列表，而name="to-delete-email"没有。同样适用于autocomplete属性。
  • 添加autocomplete属性，并添加一个对您有意义的值，如new-field-name

  它看起来像这样，在你的余生中，你不会再看到这个输入的自动填充

  <input type="text/number/something-other-than-password" name="x-field-1" autocomplete="new-field-1" />
  

• < >强(例2)< / >强: input type是password

  • 好吧，在这种情况下，无论你的试验，Chrome将显示你下拉管理密码/使用一个已经存在的密码。Firefox也会做类似的事情，所有其他主要浏览器也会如此。［1］
  • 在这种情况下，如果你真的想阻止用户看到下拉菜单来管理密码/看到安全生成的密码，你将不得不使用JS来切换输入类型，就像在这个问题的其他答案中提到的那样。

一个详细的MDN文件关闭自动完成- https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

基本上我们可以摆脱任何文本框的自动完成从chrome, firefox或任何类型的浏览器。这是简单的javascript。

window.onload=function(){
setTimeout(function(){
document.getElementById('username').value = '';
document.getElementById('password').value = '';
},100);
}

当你的窗口完成加载，100毫秒后，我们的用户名和密码字段的值将删除。 我认为这是在所有浏览器(特别是chrome)上自动完成的最好方法

2021年9月回答

当我不得不处理这个问题时，唯一稳定的解决方案是在每次渲染网站时为<input>元素中的name和autocomplete属性生成一个随机字符串。

下面是一个使用纯JavaScript的简单演示。

Html:

<div>
<h3>Autofill disabled with random string</h3>
<form id="disable-autofill-form">
<div>
<span>First Name</span>
<input type="text" />
</div>
<div>
<span>Last Name</span>
<input type="text" />
</div>
<div>
<span>City</span>
<input type="text" />
</div>
<div>
<span>Street</span>
<input type="text" />
</div>
<div>
<span>Postal Code</span>
<input type="text" />
</div>
</form>
</div>

JavaScript:

const randomString = (Math.random() + 1).toString(36).substring(5);
const disableAutoFillForm = document.getElementById('disable-autofill-form');
const disableAutoFillFormInputs = [
...disableAutoFillForm.getElementsByTagName('input'),
];
disableAutoFillFormInputs.forEach((input) => {
input.setAttribute('autocomplete', randomString);
input.setAttribute('name', randomString);
});

一个Stackblitz项目来玩它可以在这里找到。

我发现了一个窍门:

<input type="password" id="some_id" name="some_name" value=" " placeholder="Password">


<script>
$(function)
{
$("#some_id").val("");
}
</script>

注意，value是空格。它防止自动堆积在Chrome和输入字段显示占位符。

这些方法都不再工作，chrome忽略所有这些属性，唯一的解决方案是使用jquery

在输入上使用这个

# EYZ0

我不得不在drupal页面上用一个巨大的webform来解决这个问题。因为我不能编辑每个输入的html代码，所以我想出了下面的通用jQuery解决方案。

<script>


// Form Autocomplete FIX
function is_mobile() {
if( screen.width < 500 || navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) ) {
return true;
}
return false;
}
jQuery( 'input[autocomplete="off"]' ).each( function() {
if( is_mobile() ) {
return;
}
jQuery( this ).attr( 'readonly', true );
} );
jQuery( 'input[autocomplete="off"]' ).focus( function() {
if( is_mobile() ) {
return;
}
jQuery( this ).removeAttr( 'readonly' );
jQuery( this ).focus();
} );
jQuery( 'input[autocomplete="off"]' ).blur( function() {
if( is_mobile() ) {
return;
}
jQuery( this ).attr( 'readonly', true );
} );


</script>

浏览器检测在这里。

我想有可能优化这段代码(我很想获得一些建议)，但您将从中获得想法。

快速破解，如果你读了上面的答案仍然得到自动补全，你可以试试这个。给出随机字符串将删除自动补全。

<input autocomplete="somerandomstring" or autocomplete="disabled">

我不知道这方法对不对，它就是对我有用。

我最近遇到了这个问题，没有一个答案对我有用。在我的例子中，因为我不关心输入字段嵌套在&;form&;标签，我修复了chrome自动完成的问题提供了一个空的数据表的输入。所以现在chrome应该从“数据列表”中为你提供自动补全建议。它是空的。请记住，如果输入嵌套在&;form&;标签。令人惊讶的是，除了这个技巧，其他什么都不管用。

<input type="text" autocomplete="off" list="emptyList" />
<datalist id="emptyList"></datalist>

考虑到浏览器兼容性，使用它似乎是安全的。

我找到了一个适合我的解决办法。它没有禁用自动完成，但允许自定义它。在Chrome 96, Opera 82测试

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
border: none;
border-bottom: 1px solid;
-webkit-text-fill-color: #000;
-webkit-box-shadow: 0 0 0 1000px transparent inset;
}

我有一个非常简单的解决方案，这个问题不需要代码和一个可接受的解决方案。Chrome经常读取输入的标签并自动完成。你可以简单地插入一个“空”;字符放入标签中。

E.g. <label>Surname</labe>


Becomes: <label>Sur&#8205;name</label>

‍是“空字符串”的HTML转义字符。

这仍然会显示“姓氏”;但是自动完成不会检测到该字段并尝试自动完成它。

唯一的解决方案，工作和测试成功的Chrome和Firefox是包装input与form，有autocomplete="off"如下所示:

<form autocomplete="off">
<input id="xyz" />
</form>

更新:08/2022

我设法让自动补全通过包含得到尊重

autocomplete="new-password"

在每个单独的输入元素上。

如。

<input id="email" type="email" autocomplete="new-password"/>