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');
});

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

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

Autocomplete =off在现代浏览器中基本上被忽略了——主要是由于密码管理器等。

你可以尝试添加这个autocomplete="new-password"，它不是所有浏览器都完全支持，但在一些浏览器上是有效的

Chrome版本34现在忽略autocomplete=off， 看到这个。

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

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

例子:

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

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

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

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

截至Chrome 42，这个线程中的解决方案/hacks(截至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);