题 如何禁用Chrome以自动填充用户名/电子邮件密码?


我知道它在SO上已被多次回答,但这适用于旧版本的Chrome。

我有Chrome版本53.0.2785.143。

我想禁用Chrome以自动填充密码字段,

我已经尝试了旧的SO答案中提到的所有方法,

方法1:

尝试使用假用户名密码。

<input style="display:none" type="text" name="fakeusernameremembered"/>
<input style="display:none" type="password" name="fakepasswordremembered"/>

方法2:

尝试使用 autocomplete='new-password' 和 autocomplete='false' 和 autocomplete='off'

但它都不起作用。


13
2017-10-23 06:15


起源


我认为我不可能只知道autocomplete =“off”,但这不是你提到的解决方案。我认为唯一的方法是为您的输入生成名称。这只是我的意见
这个问题已经被问到了。请参见: stackoverflow.com/questions/12374442/... - yivo
@Umair你试过我的解决方案。发生了什么事,发生了什么事 - Sachith
可能重复 在自动填充上删除输入上的黄色背景 - Amr Elgarhy
stackoverflow.com/a/50238206/3444315 - EngineerCoder


答案:


尝试这个  display:none 

<input type="text" name="prevent_autofill" id="prevent_autofill" value="" style="display:none;" />
<input type="password" name="password_fake" id="password_fake" value="" style="display:none;" />
<input type="password" name="password" id="password" value="" />

你也可以使用 jQuery 解决这个问题,希望这对你有所帮助,如果不是请在这里发表评论,祝你好运:)

更新:

这取决于chrome版本,有时这对chrome新版本不起作用,所以你应该尝试很多东西来防止这个问题,也尝试这些代码片段并请发表评论发生了什么:)

解决方案2

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

它从元素中删除“name”和“id”属性,并在1ms后将其分配回来。把它放在文件准备好了。

解决方案3

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

经过测试并可在Chrome 53中使用

解决方案4

尝试 autocomplete="false" 代替 autocomplete="off" 要么 nofill


10
2017-10-23 06:39



这些解决方案都不适合我。我在Windows 10上运行Chrome 57.0.2987.133(64位)。 - cristiancastrodc
我真的很讨厌Chrome的自动填充功能。当然,我可以在我的电脑中禁用它。但我不能在每台使用我的应用程序的PC上禁用它,所以这不是解决方案= / - cristiancastrodc
解决方案3适用于Chrome 60.0.3112.90。谢谢! - Maxim Mazurok
这是我们发现的,chrome故意忽略autocomplete属性,请参阅线程中的最后一个答案 bugs.chromium.org/p/chromium/issues/detail?id=468153 - Haris
添加 autocomplete="new-password" 是截至2017年9月17日的正确方法。 - kjdion84


  1. 添加自动填充属性,其值为用户名的用户名。
  2. 如果您已实现将用户名和密码分隔为两个单独表单的“首先发送电子邮件”登录流程,请在用于收集密码的表单中包含一个包含用户名的表单字段。当然,如果适合您的布局,您可以通过CSS隐藏此字段。
  3. 在登录表单中为密码字段添加一个autocomplete属性,其值为current-password。
  4. 在注册和更改密码表单上为密码字段添加值为new-password的自动完成属性。
  5. 如果您要求用户在注册或密码更新期间键入两次密码,请在两个字段中添加新密码自动完成属性。

    <input type="text" autocomplete="username">
    <input type="password" autocomplete="current-password">
    

2
2017-11-03 09:49



这至少在Chrome上运行得非常好,与此相比,所有其他解决方案都是hacky。谢谢 - João Antunes


Chrome只会在输入时自动填写密码 type="password"  - 否则可能会以明文形式暴露用户密码。所以,使用 type="text" 在输入字段上,然后将type属性更改为 "password" 当用户专注于输入时。

密码字段:

<input type="text" class="form-control" placeholder="Password"
    onfocus="this.setAttribute('type', 'password')" />

完整示例: (使用Bootstrap 3类和Font Awesome图标)

<form>
    <div class="form-group">
        <input type="text" class="form-control" placeholder="Email Address" />
    </div>
    <div class="form-group">
        <input type="text" class="form-control" placeholder="Password" 
            onfocus="this.setAttribute('type', 'password')" />
    </div>
    <div class="text-xs-center">
        <button type="submit" class="btn btn-primary" style="width: 100%;">
            <i class="fa fa-lock" style="padding-right: 10px;"></i> LOG IN
        </button>
    </div>
</form>

1
2018-06-27 19:47



在Chrome上不再有效...当你对焦场时,它会自动填充。 - Arvy
在Firefox 60.0.1中也不起作用。 - Jeff


在管理员想要更改用户的电子邮件/密码的情况下,自动填充用管理员和填写的管理员密码替换用户的电子邮件。

对我有用的是将字段(电子邮件,密码...)设置为禁用,并在加载页面后一秒钟启用tiemout。以这种方式,在浏览器自动填充忽略它们之后,用户可以使用它们。

风险是某些东西打破了js并且它们仍然不可用。

如果您的服务器部分不太依赖于输入名称,我建议只将它们更改为与登录表单中使用的不同 - 它们不会自动填充(除非您特别要求)。 

否则这里是示例代码:

 <input id="email" type="email" name="email" value="email@example.com" disabled>
    <input id="password" type="password" name="password" disabled>

    <script>
    $(document).ready(function(){
         setTimeout(
            function(){
                $('#myform input[diabled]').removeAttr('disabled');
            }, 1000);
    );
    </script>

0
2018-05-29 10:48





一个可能的解决方案是初始将输入类型设置为“text”,然后为输入添加一个事件侦听器,一旦编辑了字段,就会将类型更新为“password”。这将允许您保留密码输入的所有功能,并希望绕过任何密码自动填充/管理器。就像是:

HTML

<input type='text' class='my-input' />

JS

const input = document.querySelector('.my-input');

input.addEventListener('keydown', () => {
    input.setAttribute('type', 'password');
});

0
2018-02-06 21:30





使用jQuery disableAutoFill插件

$('#login-form').disableAutoFill();

文件: https://github.com/terrylinooo/jquery.disableAutoFill

演示: https://terrylinooo.github.io/jquery.disableAutoFill/


0
2018-03-29 03:23





我终于找到了成功使用 textarea 使用事件处理程序替换用“•”键入的每个字符。


0
2018-05-21 02:57





不幸的是没有什么对我有用(win10,opera / chomium)没有“新密码”,没有其他解决方案......内联样式也存在问题,当它被隐藏时,自动完成进展

这是我的工作解决方案:我们需要两个type = password,然后首先通过外部css隐藏

<input type="password" class="vapor zero">
<input
    id="hes"
    type="password"
    placeholder="actual password"
    autocomplete="off"
    autocomplete="false"
    autocorrect="off"
    name="password2"
    value=""
    autocomplete="new-password"
    required>

CSS:

.zero{
    width:0px !important;
    height:0px !important;
    padding:0 !important;
    border:1px solid white;
}

jquery杀手(只是肯定):

$(".vapor").fadeOut(5400, function() {
    $(this).remove();
});

-2
2017-11-10 00:25





你可以尝试这种方式。

关闭自动填充 如果您不希望每次填写表单时都看到保存的个人信息,则可以关闭自动填充功能。

打开Chrome。 在 右上,单击更多更多然后 设置。

在底部,单击“显示” 高级设置

在“密码和表格,“取消选中”启用自动填充 只需点击一下即可填写网页表格。“ 要重新打开自动填充,请再次选中该复选框。


-5
2017-10-23 06:33



我是否应该显示一个教程弹出窗口,要求每个用户在浏览器中选择自动填充 - Umair