html - 停止谷歌浏览器自动填充输入

Question

我有一个input type text供用户在帐户设置页面更改他们的电子邮件和密码。

如何阻止Chrome自动填充输入。

Chrome会记住input data从登录页面，它会自动填写帐户设置页面。

Chrome在帐户设置页面中自动填写input 更改我的电子邮件和密码

Answer 1

我们不再依赖黑客来实现这一点。您可以将自动完成设置为新密码，它会按预期工作。

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

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete

Answer 2

您是否明确将值设置为空白？例如：

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

这应该会阻止浏览器将数据放在不应该的地方。或者，您可以将自动完成属性添加到表单标签：

<form autocomplete="off" ...></form>

Answer 3

解决方案 1： 将 2 行代码放在<form ..>标签下就可以了。

<form id="form1" runat="server" >
<input style="display:none" type="text" name="fakeusernameremembered"/>
<input style="display:none" type="password" name="fakepasswordremembered"/>

...

阅读更多

解决方案 2：它从元素中删除“name”和“id”属性，并在 1ms 后将它们分配回来。把这个放在文件准备好。

$('form[autocomplete="off"] input, input[autocomplete="off"]').each(function () {

                var input = this;
                var name = $(input).attr('name');
                var id = $(input).attr('id');

                $(input).removeAttr('name');
                $(input).removeAttr('id');

                setTimeout(function () {
                    $(input).attr('name', name);
                    $(input).attr('id', id);
                }, 1);
            });

解决方案 3：在 Chrome 60.0.3112.101 中测试

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

Answer 4

自版本 55.0.2883.87 m 起，此问题仍然存在。（在 Windows 10 上）

解决方案，例如在表单上设置自动完成属性

或在提交之前添加虚假输入字段并删除名称属性不再起作用，因为 Chrome 会在删除时忽略或立即自动完成它们。

使其当前按预期工作的唯一方法是将自动完成属性设置为“新密码”

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

即使在非密码类型输入上。

Answer 5

最新版本的 Chrome (46.0.2490.86) 似乎再次改变了行为。autocomplete这一次，自动填充与此处建议的或其他解决方法无关readonly（以及这些错误报告https://code.google.com/p/chromium/issues/detail?id=468153，https://bugs.chromium .org/p/chromium/issues/detail?id=587466）

相反，AutoFill 现在查看输入框旁边的标签并基于该标签（以及 id 和名称）生成 AutoFill。一个重要的线索是 AutoFill 如何实际上一次填充多个字段（例如 Street、Suburb 和 State）。它似乎使用了几种技术（标签、名称、id）来辨别字段之间的空间关系。

因此，一种解决方法是将垃圾文本插入隐藏跨度内的标签中......

S<span style="display:none">_</span>uburb:

...并且还混淆/删除 id 和 name。这是唯一阻止我进行 Suburb AutoFill 的事情。

Answer 6

不幸的是autocomplete="off"（不再）对我有用。所以这是我的解决方案：

首先读取然后从元素中删除“ name”和“ id”属性。然后，在 1 毫秒后，使用之前读取的值再次设置这些属性。对我来说它有效:)

<form autocomplete="off"><br />
<input type="text" name="username" id="username" /><br />
<input type="password" name="password" id="password" /><br />
</form>

<pre>
    $('form[autocomplete="off"] input, input[autocomplete="off"]').each(function(){

        var input = this;
        var name = $(input).attr('name');
        var id = $(input).attr('id');

        $(input).removeAttr('name');
        $(input).removeAttr('id');      

        setTimeout(function(){ 
            $(input).attr('name', name);
            $(input).attr('id', id);            
        }, 1);
    }); 
</pre>

Answer 7

通过设置 autocomplete="new-password" ，它可以工作。测试前先清除浏览数据

Answer 8

Chrome 会忽略 autocomplete="anything" 和隐藏字段。HTML/CSS 解决方法是在真正的密码字段之前使用绝对定位的密码字段：

<input type="text" name="username" required>
<input style="visibility: hidden; position: absolute; left:-99999px" type="password" name="fakepasswordfieldtoturnoffautocomplete">
<input type="password" name="password" required>

---

编辑：

正如其他重复问题中的多个其他答案所提到的，迄今为止最优雅的工作解决方案是：

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

Answer 9

几乎跳出窗口试图解决这个问题......似乎谷歌现在忽略了自动完成的开启和关闭。我曾在较旧的修复上使用过（例如伪造的隐藏密码字段 - 这也不再有效）。根据生活标准规范 - 您需要改用自动填充令牌。您必须在适当的用例上下文中使用它们。希望这会有所帮助。

https://html.spec.whatwg.org/multipage/forms.html#autofilling-form-controls:-the-autocomplete-attribute

Answer 10

尝试隐藏密码元素

<form>
   <input type="text" name="fakeusername" class="fake-autofill-fields"/>
    <input type="password" name="fakepassword" class="fake-autofill-fields"/>
...
...
</form>


<script>
    $(document).ready(function () {
        $(".fake-autofill-fields").show();
        window.setTimeout(function () {

            $(".fake-autofill-fields").hide();
        }, 1);
    });
</script>

Answer 11

为用户名字段输入值“”（空格），Chrome 不会自动填充用户名或密码。

<input type = 'text' value = ' ' name = 'username' />

如果您曾经使用用户输入的值填充用户名，如果没有用户输入的值，则代码输入“”。

Answer 12

尝试这个：

<div id="form_container">
    <input type="text" name="username" autocomplete="off">
    <input type="password" name="pwd" autocomplete="off">
    <input tytep="submit" name="login" id="login" value="Log In">
</div>`

jQuery代码：

jQuery("#login").click(function(){
    jQuery("#form_container").wrap('<form method="post"></form>');
    jQuery("form").submit();
});

如果您不将输入字段包装到表单中，则不会出现 chrome 的自动填充功能。

当您单击提交按钮时，只需将表单周围的字段折叠起来并在表单上触发submit()。

Answer 13

我有一个类似的问题。在所有尝试都失败之后。我尝试了这种设置技巧

type = "search"

而不是文字。即使它不是一个漂亮的黑客。在大多数情况下，它不会引起任何问题。到目前为止，类型搜索与文本没有什么不同。

Answer 14

这有效：

<form autocomplete="off" ...></form>

在 Chrome 56.0.2924.87（64 位）上测试