只需将值为“off”的属性autocomplete设置为输入类型。

<input type="password" autocomplete="off" name="password" id="password" />

为了解决这个问题，我使用了一些CSS技巧和以下工作。

input {
    text-security:disc;
    -webkit-text-security:disc;
    -mox-text-security:disc;
}

请阅读本文了解更多详情。

由于自动完成的行为在不同的浏览器和版本中几乎是不可预测的，所以我的方法是不同的。指定要禁用只读属性自动填充的所有输入元素，并仅在聚焦时禁用它。

  document.addEventListener('click', (e) => {
    readOnlys.forEach(readOnly => {
      if (e.target == readOnly) {
        readOnly.removeAttribute('readonly', '');
        readOnly.style.setProperty('pointer-events', 'none');
      } else {
        readOnly.setAttribute('readonly', '');
        readOnly.style.setProperty('pointer-events', 'auto');
      }
    });
  });
  document.addEventListener('keyup', (e) => {
    if (e.key == 'Tab') {
      readOnlys.forEach(readOnly => {
        if (e.target == readOnly) {
          readOnly.removeAttribute('readonly', '');
          readOnly.style.setProperty('pointer-events', 'none');
        } else {
          readOnly.setAttribute('readonly', '');
          readOnly.style.setProperty('pointer-events', 'auto');
        }
      });
    }
  });

如果您想确保用户在禁用JS的情况下仍然可以访问字段，那么可以在页面加载时通过JS设置所有只读。您仍然可以使用autocomplete属性作为回退。

如果删除表单标记，则可以禁用自动完成。

我的银行也是这样做的，我想知道他们是怎么做到的。它甚至会删除删除标记后浏览器已经记住的值。

2022年9月

一些浏览器，如Google Chrome，甚至不关心autocomplete属性的值。停止获取建议的最佳方法是将输入的name属性更改为随时间变化的属性

截至2022年9月，浏览器将不提供一次性密码自动完成功能

所以我们可以使用otp作为域名。

<input name=“otp”>

我的jQuery解决方案。它可能不是100%可靠，但它对我有用。这个想法在代码注释中描述。

/***防止字段自动填充字段。*当关注具有自动完成功能的文本字段（值为：“off”、“none”、“false”）时，我们将该值替换为新的唯一值（此处为-“off forced-[TIMESTAMP]”），*浏览器在保存的值中找不到这种类型的自动完成，并且不提供选项。*然后，为了防止输入的文本保存在浏览器中，以便进行新的唯一自动完成，当字段失去焦点或用户按下Enter键时，我们将其替换为先前设置的文本。*@type｛｛init:*｝｝*/var PreventFieldsAutofill=（函数（）{函数init（）{events.onPageStart（）；}var事件={onPageStart:函数（）{$（document）.on（'fous'，'输入[autocomplete=“off”]，输入[autocomplete=“none”]，input[autocomplete=“false”]'，函数（）{methods.replaceAttrs（$（this））；});$（document）.on（'blur'，'input[data prev autocomplete]'，函数（）{methods.returnAttrs（$（this））；});$（document）.on（'keydown'，'input[data prev autocomplete]'，函数（事件）{if（event.keyCode==13 | | event.which==13）{methods.returnAttrs（$（this））；}});$（document）.on（'submit'，'form'，函数（）{$（this）.find（'input[data prev autocomplete]'）.each（函数（）{methods.returnAttrs（$（this））；});});}};var方法={/***将autocomplete和name属性的值替换为unique，并将原始值保存为新的数据属性*@param$输入*/replaceAttrs:函数（$input）{var randomString='off-forced-'+Date.now（）；$input.attr（'data-prev-autocomplete'，$input.aattr（'自动完成'））；$input.attr（'自动完成'，随机字符串）；if（$input.attr（'name'））{$input.attr（'data-prev-name'，$input.atr（'name'））；$input.attr（'name'，randomString）；}},/***恢复原始自动完成和名称值，以防止在浏览器中保存文本以获取唯一值*@param$输入*/returnAttrs:函数（$input）{$input.attr（'自动完成'，$input.atr（'数据-版本-自动完成'））；$input.removeAttr（'data-prev-autocomplete'）；if（$input.attr（'data-prev-name'））{$input.attr（'name'，$input.atr（'data-prev-name'））；$input.removeAttr（'data-prev-name'）；}}};返回{init：初始化}})();PreventFieldsAutofill.init（）；.输入{显示：块；宽度：90%；填充：6px 12px；字体大小：14px；线高：1.42857143；颜色：#555555；背景色：#fff；背景图像：无；边框：1px实心#ccc；边界半径：4px；}<script src=“https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js“></script><form action=“#”><p><label for=“input-1”>Firts name without autocomplete</label><br/><input id=“input-1”class=“input”type=“text”name=“first name”autocomplete=“off”placeholder=“Firts name without autocomplete”/></p><p><label for=“input-2”>Firts name with autocomplete</label><br/><input id=“input-2”class=“input”type=“text”name=“first name”autocomplete=“given name”placeholder=“Firts name with autocomplete”/></p><p><button type=“submit”>提交表单</button></p></form>