Home / Questions / 129057
Accepted
Norak
Asked: 2020-01-06 04:24:28 +0800 CST 2020-01-06 04:24:28 +0800 CST

防止 Chrome 自动完成表单，输入时 autocomplete="off" 不起作用

  • 772

大家好，我在使用 Google Chrome 和自动完成时遇到问题。我希望我的表单的某些字段不自动完成，并且我添加了属性：autocomplete="off"

这在 Chrome 中不起作用，但在 Firefox 等其他浏览器中有效。如何防止仅填写某些字段？

我在互联网上看到了添加autocomplete="off"到 label的替代解决方案<form>，但这对我不起作用，因为我希望自动完成许多字段......

<form id="formulario" action="" method="">
<input type="text" name="nombre" placeholder="Nombre..." />
<input type="text" name="apellidos" placeholder="Apellidos..." />
<input type="email" name="email" placeholder="Correo electrónico..." />
<input type="text" name="codigo" placeholder="Código promocional..." autocomplete="off" />
</form>

如何防止单个输入字段在 Chrome 中自动完成？

formularios

4 Answers

  1. Best Answer

    因为谷歌浏览器自动完成问题是众所周知的，并且已经在许多论坛上被遇到过这个问题的用户讨论过，所以创建了一种“补丁”（如果你可以这么称呼它）来修复chrome禁止的内容。默认情况下，它被配置为忽略禁用自动完成的命令（ “autocomplete=off”）。@sergibarca在他的回答中显示了这个解决您问题的“补丁” 。

    作为补充，我应该补充一点，您可以通过将相关输入的自动完成设置为您知道该字段中永远不会存在的值来使chrome尝试查找不存在的代码。这样，chrome将无法向您显示任何自动完成选项，因为它找不到与自动完成匹配的选项。

    在您的情况下可以这样实现：

    <input type="text" name="codigo" placeholder="Código promocional..." autocomplete="ÑÖcompletes" />

    几乎没有chrome会找到与"ÑÖcompletes"匹配的自动完成内容。当然，您可以将此值更改为看起来更优雅或更适合您的值。

    参考：

    对于补丁。这里！

    对于不存在值的自动完成：这里！

    要查看对与您类似的问题的两种响应：这里

    奖金，它也发生在 Mozilla 身上！这里！

    就这些。问候

    • 7

  2. 在查看了几页带有 JS、JQuery 和其他代码答案的页面后，我发现在今天（2019 年 8 月 20 日）对我有用的众多选项中。

    我省略了在 FORM 标记和每个 TEXT 类型的 INPUT 中添加 autocomplete="off"，我使用了 autocomplete="new-text"：

    <input type="text" name="nombre" autocomplete="new-text">

    在每个 PASSWORD 类型的 INPUT 中：

    <input type="password" name="clave" autocomplete="new-password">

    我不需要在我的表单中使用其他类型的字段，但是按照相同的逻辑，我想应该根据每种类型将 NUMBER 类型更改为“new-number”等等。

    希望你和我一样拯救下午，问候！

    • 2

  3. 您可以做的是创建一个输入，使用 CSS 捕获隐藏的自动完成。

    例子

    <input style="display:none" type="text" name="falsocodigo" autocomplete="off" />

<input type="text" name="codigo" placeholder="Código promocional..." autocomplete="off" />

    • 1

  4. 在尝试了许多选项之后，这是唯一在 Chrome 中对我有用的选项：

    <input type="text" name="nombre" autocomplete="new-text">

    它也适用于角度或离子组件。

    <ion-searchbar autocomplete="new-text"></ion-searchbar>
    • 0