Html “AutoComplete=Off”不适用于 Google Chrome 浏览器

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18306052/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 12:17:55  来源:igfitidea点击:

"AutoComplete=Off" not working on Google Chrome Browser

htmlgoogle-chromeforms

提问by user2492270

I know there is one similar question on Stackoverflow, but none of the solution there worked for me.

我知道 Stackoverflow 上有一个类似的问题,但没有一个解决方案对我有用。

<form autocomplete="off" id="search_form" method="post" action="">
    <input autocomplete="off" type="text" />
</form>

As you can see, I put autocomplete=offon BOTH the form and the input field, but Google Chrome still displays this autocompletion list. This doesn't happen in other browsers like Firefox and Safari.

如您所见,我同时添加autocomplete=off了表单和输入字段,但 Google Chrome 仍显示此自动完成列表。这在 Firefox 和 Safari 等其他浏览器中不会发生。

Any other solution other than putting autocomplete=offon the form tag??

除了放置autocomplete=off表单标签之外还有其他解决方案吗??

回答by Keith

This is due to a design decision made by Chrome (arguably any Chrome user wantsthis behaviour).

这是由于 Chrome 做出的设计决定(可以说任何 Chrome 用户都希望这种行为)。

The reason for this is what Google calls priority of constituencies:

这样做的原因是谷歌所说的选区优先级

  1. The user is king! What they want matters most.
  2. The user wants to use a password or autofill manager.
  3. The web application says it doesn't want the form values to be saved.
  4. The user's choice is more important, so the form values are retained.
  1. 用户为王!他们想要什么最重要
  2. 用户想要使用密码或自动填充管理器。
  3. Web 应用程序说它不希望保存表单值。
  4. 用户的选择更重要,因此保留了表单值。

There are ways to work round, but it's highly likely that those will be fixed in future Chrome versions as the Chrome developers regard their behaviour as correct and your workaround as a bug.

有一些方法可以解决,但这些很可能会在未来的 Chrome 版本中得到修复,因为 Chrome 开发人员认为他们的行为是正确的,而您的解决方法是一个错误。

Even while your workaround does work it creates confusing behaviour for the user - they expect autofill to work according to their settings.

即使您的解决方法有效,它也会给用户带来令人困惑的行为 - 他们希望自动填充能够根据他们的设置工作。

Many users already chose to ignore app autocomplete settings with plug-ins or scripts that just remove any autocomplete=off in the page - they already had that choice anyway.

许多用户已经选择使用插件或脚本忽略应用程序自动完成设置,这些插件或脚本只会删除页面中的任何 autocomplete=off - 无论如何他们已经有了这个选择。

You're best off designing with the assumption that autocomplete can work and accounting for that.

你最好假设自动完成可以工作并考虑到这一点。

Personally I hate it when sites don't recall my password and override those that do with browser extensions. However I also create applications for my job and there recalling passwords is seen as a security risk, as a user might leave their machine unlocked. In my personal opinion users not locking their machines is an issue for local IT, not the application, and local IT can disable all password autocomplete for all web applications if their users can't be trusted.

我个人讨厌网站不记得我的密码并覆盖那些使用浏览器扩展的密码。然而,我也为我的工作创建了应用程序,并且在那里回忆密码被视为一种安全风险,因为用户可能会将他们的机器解锁。在我个人看来,用户不锁定他们的机器是本地 IT 的问题,而不是应用程序的问题,如果他们的用户不可信,本地 IT 可以禁用所有 Web 应用程序的所有密码自动完成。

Unfortunately to pass the security checks some applications still have to disable autocomplete, there are ways to do it, but they're all horrible. The first hack is to make the password input completely new:

不幸的是,要通过安全检查,某些应用程序仍然必须禁用自动完成功能,有很多方法可以做到,但它们都很糟糕。第一个黑客是使密码输入全新:

<input type="hidden" name="password" id="realPassword" />
<input type="password" name="{randomly generated}" 
    onchange="document.getElementById('realPassword').value = this.value" />

I've inlined everything to simplify, but this should give you an idea of the hack - no plug in or browser can auto-fill an input with a completely new name.

我已经内联了所有内容以简化,但这应该让您了解黑客 - 没有插件或浏览器可以使用全新的名称自动填充输入。

This solution breaks if you properly build in ARIA and labels (as that lets the browser/extension find and autofill the input from the label).

如果您正确构建 ARIA 和标签(因为这可以让浏览器/扩展程序找到并自动填充来自标签的输入),则此解决方案会中断。

So option 2, also horrible, is to wait until after the autocomplete has fired and then blank the field:

因此,同样可怕的选项 2 是等到自动完成触发后,然后将字段清空:

<input type="text" name="username" 
    onchange="window.setTimeout(function() { 
        document.getElementById('password').value = ''; 
    }, 100)" />
<input type="password" id="password" />

Like I said, nasty.

就像我说的,恶心。

回答by Bedonkey

It may be a bug on Google Chrome, you can't cheat by create an hidden input over. Auto complete feature will get the first input text to fill data.

这可能是谷歌浏览器上的一个错误,你不能通过创建一个隐藏的输入来作弊。自动完成功能将获取第一个输入文本以填充数据。

<form autocomplete="off" id="search_form" method="post" action="">
    <input type="text" style="display:none" />
    <input autocomplete="off" type="text" />
</form>

回答by federico-t

This seems to be a recurrent issue in Google Chrome, although adding autocomplete off to the form didwork in my build. Maybe in newer versions it doesn't anymore.

这似乎是 Google Chrome 中经常出现的问题,尽管向表单添加自动完成功能在我的构建中确实有效。也许在较新的版本中它不再存在。

This is a hack.Give your input an id, say foo, and in JavaScript:

这是一个黑客。给你的输入一个 id,比如说foo,在 JavaScript 中:

if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0) {
    setTimeout(function () {
        document.getElementById('foo').autocomplete = 'off';
    }, 1);
}

Check if this works for you. The only downside to it would be that for those who use Chrome andhave JavaScript disabled, the field would still be autocompleted.

检查这是否适合您。唯一的缺点是,对于那些使用 Chrome禁用 JavaScript 的人来说,该字段仍会自动完成。

回答by Praveen

The autocompleteattribute is new in HTML5.

autocomplete属性是HTML5.

Since you haven't mentioned the DOCTYPE, I think this is the only possible reason could be this. For further details check MDN's How to Turn Off Form Autocompletion.

由于您没有提到DOCTYPE,我认为这是唯一可能的原因。有关更多详细信息,请查看MDN 的如何关闭表单自动完成功能

Try adding the following HTML5 DOCTYPE.

尝试添加以下内容HTML5 DOCTYPE

<!DOCTYPE html>

FYI:In some browsers you may need to activate an autocompletefunction for this to work (Look under "Preferences" in the browser's menu).

仅供参考:在某些浏览器中,您可能需要激活一项autocomplete功能才能使其工作(在浏览器菜单中的“首选项”下查看)。

You're using it in a correct way mentioning autocompleteattribute under formelement. However you don't need it to be mentioned separately for inputtag.

您正在以正确的方式使用它,并autocompleteformelement下提及属性。但是,您不需要为input标记单独提及它。

<form autocomplete="off" id="search_form" method="post" action="">
    <input type="text" />
</form>

Update:Here you can find a list of solutions in autocomplete attribute and web documents using XHTML.

更新:在这里您可以找到使用 XHTML 的自动完成属性和 Web 文档中的解决方案列表。

回答by Sirikumara

if you are using AJAX call to submit data to backend. After completing AJAX call, password fields should be clear. Then password save prompt will not be popped.

如果您使用 AJAX 调用向后端提交数据。完成 AJAX 调用后,密码字段应清晰。这样就不会弹出密码保存提示了。

Eg: $(#foo).val("");

例如: $(#foo).val("");

回答by Luke Snowden

try this, worked for me after messing about for a bit

试试这个,在搞砸了一段时间后为我工作

if ( navigator.userAgent.toLowerCase().indexOf('chrome') >= 0 ) {
    $('input[autocomplete="off"]').each( function(){
        var type = $(this).attr( 'type');
        $(this).attr( 'type', '_' + type );
        $(this).attr( 'type', type );
    });
}