如何在主要浏览器中禁用特定输入(或表单字段)的自动完成?


当前回答

我真不敢相信,这件事被报道了这么久,仍然是一个问题。以前的解决方案对我来说不起作用,因为Safari似乎知道元素何时不显示或不在屏幕上,但下面的解决方案确实对我起作用:

<div style="height:0px; overflow:hidden; ">
  Username <input type="text" name="fake_safari_username" >
  Password <input type="password" name="fake_safari_password">
</div>

其他回答

这对我来说就像一种魅力。

将表单的自动完成属性设置为关闭添加虚拟输入字段,并将其属性设置为禁用。

<form autocomplete=“off”><input-type=“text”autocomplete=“off”style=“display:none”></form>

Firefox 30忽略密码的autocomplete=“off”,而是选择提示用户密码是否应存储在客户端上。请注意2014年5月5日的以下评论:

密码管理器始终提示是否要保存密码。未经用户许可,密码不会保存。我们是继IE和Chrome之后第三个实现这一改变的浏览器。

根据Mozilla开发者网络文档,布尔表单元素属性autocomplete防止表单数据在旧浏览器中缓存。

<input type="text" name="foo" autocomplete="off" />

我通过添加两个假输入并赋予它们绝对位置来阻止Chrome 66自动填充:

<form style="position: relative">
  <div style="position: absolute; top: -999px; left: -999px;">
    <input name="username" type="text" />
    <input name="password" type="password" />
  </div>
  <input name="username" type="text" />
  <input name="password" type="password" />

起初,我尝试添加display:none;但Chrome忽略了这些输入,并自动填充可见的输入。

为字段使用非标准的名称和id,因此“name”不是“name_”。浏览器将不会将其视为名称字段。

最好的一点是,您可以对某些但不是所有字段执行此操作,并且它将自动完成某些但不是全部字段。

其想法是创建一个与原始字段同名的不可见字段。这将使浏览器自动填充隐藏字段。

我使用以下jQuery片段:

// Prevent input autocomplete
$.fn.preventAutocomplete = function() {
    this.each(function () {
        var $el = $(this);
        $el
            .clone(false, false) // Make a copy (except events)
            .insertBefore($el)   // Place it before original field
            .prop('id', '')      // Prevent ID duplicates
            .hide()              // Make it invisible for user
        ;
    });
};

然后只需$(“#登录表单输入”).prpreventAutocomplete();