Chrome 忽略 autocomplete="off"

Question

我创建了一个使用标签框下拉列表的 Web 应用程序。这适用于所有浏览器，除了 Chrome 浏览器（版本 21.0.1180.89）。

尽管 input 字段和 form 字段都具有 autocomplete="off" 属性，Chrome 坚持显示以前条目的下拉历史记录标签框列表。

原文由 Mr Fett 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

防止自动完成用户名（或电子邮件）和密码：

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

---

防止自动完成字段（ 可能不起作用）：

 <input type="text" name="field" autocomplete="nope">

解释：

autocomplete still works on an <input> despite having autocomplete="off" , but you can change off to a random string, like nope 。

---

其他禁用字段自动完成的 “解决方案” （这不是正确的方法，但它有效）：

1.

HTML:

 <input type="password" id="some_id" autocomplete="new-password">

JS（加载）：

 (function() {
    var some_id = document.getElementById('some_id');
    some_id.type = 'text';
    some_id.removeAttribute('autocomplete');
})();

或使用 jQuery：

 $(document).ready(function() {
    var some_id = $('#some_id');
    some_id.prop('type', 'text');
    some_id.removeAttr('autocomplete');
});

---

2.

HTML:

 <form id="form"></form>

JS（加载）：

 (function() {
    var input = document.createElement('INPUT');
    input.type = 'text';
    document.getElementById('form').appendChild(input);
})();

或使用 jQuery：

 $(document).ready(function() {
    $('<input>', {
        type: 'text'
    }).appendTo($('#form'));
});

---

使用 jQuery 添加多个字段：

 function addField(label) {
  var div = $('<div>');
  var input = $('<input>', {
    type: 'text'
  });

  if(label) {
    var label = $('<label>', {
      text: label
    });

    label.append(input);
    div.append(label);
  } else {
    div.append(input);
  }

  div.appendTo($('#form'));
}

$(document).ready(function() {
  addField();
  addField('Field 1: ');
});

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form"></form>

---

工作于：

• 铬：49+

• 火狐浏览器：44+

原文由 Cava 发布，翻译遵循 CC BY-SA 4.0 许可协议