如何禁用 chrome / jquery 的自动完成和自动填充答案

【问题标题】：How to disable autocomplete and autofill for chrome / jquery如何禁用 chrome / jquery 的自动完成和自动填充
【发布时间】：2021-04-06 19:30:34
【问题描述】：

我想同时禁用 Chrome 自动完成和 Chrome 自动填充。

我正在使用 JQuery UI 来自动完成输入字段。我的 jquery-ui 自动完成 工作正常，但是 chrome 浏览器在我的顶部显示它自己的 autofill 使用户很难选择正确的下拉项。

我正在使用 autocomplete="off"，它似乎禁用了 chrome 的自动完成功能，但显示了 自动填充选项。

我尝试了以下方法：

autocomplete="chrome-off"autocomplete="false"autocomplete="disabled"

那些属性值（或任何无效的属性值）似乎禁用了 *autofill 但确实启用了 autocomplete。

重要： 我无法使用随机名称属性，因为我正在为自己的 jquery-ui 自动完成执行 ajax 请求

【问题讨论】：

如果您还没有引用此链接stackoverflow.com/questions/15738259/disabling-chrome-autofill，您可以检查这是否满足您的需求
@NewBee 虽然这两个问题非常相似，但没有一个答案真正适用于我的案例。最后一次更新是在 2020 年 9 月，但即使这样也对我不起作用，正如我在原始查询中提到的那样。

标签： javascript html jquery google-chrome autocomplete

【解决方案1】：

自动完成=“关闭”

不再起作用了。从 2019 年开始唯一有效的是

autocomplete="新密码"

【讨论】：

根据我原来的帖子，我已经尝试过了。这相当于传递一个随机值。它会禁用自动填充，但会显示 chrome 自动完成下拉菜单。
jqueryscript.net/form/… 检查这个 jquery 插件并告诉我
感谢您的评论。正如我在原始帖子中提到的那样'我不能使用随机名称属性，因为我正在为自己的 jquery-ui 自动完成执行 ajax 请求'

【解决方案2】：

我终于通过结合几个不同的答案找到了解决方案。

第 1 步

为了解决 自动完成 问题，您可以添加一个虚拟的不可见输入字段，如 here 所述。所以你的 html 应该是这样的：

<input id="dummy_location" type="search" name="dummy_location" style='display: none;'>
<input id="location" type="search" name="location">

这将导致 chrome 自动填充弹出窗口

第 2 步

要禁用自动填充弹出窗口，我们需要像这样为 autocomplete 属性添加一个无效值。

$("#fromcity_ac").attr({
     autocomplete: "chrome-off",
});

你可以在这里停下来。

Chrome 可以正常工作，但是在其他浏览器（例如 firefox）上会弹出自动完成问题。要解决此问题，您可以通过检查正在使用的浏览器并为 autocomplete 属性设置适当的值来编辑 步骤 2。

var isChromium = window.chrome;
var winNav = window.navigator;
var vendorName = winNav.vendor;
var isOpera = typeof window.opr !== "undefined";
var isIEedge = winNav.userAgent.indexOf("Edge") > -1;
var isIOSChrome = winNav.userAgent.match("CriOS");

// Autocomplete default value
var autocomplete = "chrome-off";
if (isIOSChrome) {
  // is Google Chrome on IOS
} else if (
  isChromium !== null &&
  typeof isChromium !== "undefined" &&
  vendorName === "Google Inc." &&
  isOpera === false &&
  isIEedge === false
) {
  // Is google chrome
} else {
  // Is firefox
  autocomplete = "off";
}

【讨论】：

【解决方案3】：

autocomplete="off" 到 autocomplete="random-value"。这是目前的临时修复。

【讨论】：

根据我原来的帖子，我已经尝试过了。这相当于autocomplete="disabled" 无效。它会禁用自动填充，但会显示 chrome 自动完成下拉菜单。

【解决方案4】：

试试这个，这适用于 chrome

autocomplete="chrome-off"

【讨论】：

根据我原来的帖子，我已经尝试过了。它会禁用自动填充，但会显示 chrome 自动完成下拉菜单。

【解决方案5】：

截至 2022 年初，这似乎可行：

autocapitalize="off" autocomplete="off" autocorrect="off" autofocus="" role="combobox" spellcheck="false"

这是在 google 主页搜索框上使用的技术。

【讨论】：