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


当前回答

我刚刚遇到了这个问题,并尝试了几次失败,但这一次对我有效(在MDN上找到):

在某些情况下,浏览器将继续建议自动完成值即使autocomplete属性设置为off。这是意外的对于开发人员来说,这种行为可能非常令人困惑。真正的诀窍强制无完成是将随机字符串分配给属性像这样:

autocomplete="nope"

其他回答

最佳解决方案:

防止自动完成用户名(或电子邮件)和密码:

<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在<input>中继续工作,autocomplete=“off”不工作,但您可以将off更改为随机字符串,如nope。

工作地点:

铬:49、50、51、52、53、54、55、56、57、58、59、60、61、62、63和64Firefox:44、45、46、47、48、49、50、51、52、53、54、55、56、57和58

有时,即使autocomplete=off也无法阻止将凭据填写到错误的字段中,而不是用户或昵称字段。

除了apinstein关于浏览器行为的帖子之外,还有一个变通方法。

修复浏览器自动填充为只读,并在焦点上设置为可写(单击并选项卡)

 <input type="password" readonly
     onfocus="this.removeAttribute('readonly');"/>

更新:

Mobile Safari在字段中设置光标,但不显示虚拟键盘。新的修复程序与以前一样,但它处理虚拟键盘:

<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
    this.removeAttribute('readonly');
    // fix for mobile safari to show virtual keyboard
    this.blur();    this.focus();  }" />

现场演示https://jsfiddle.net/danielsuess/n0scguv6/

//更新结束

因为浏览器自动将凭据填充到错误的文本字段!?

我注意到在Chrome和Safari上,当相同的表单中有密码字段时,会出现这种奇怪的行为。我猜浏览器会寻找一个密码字段来插入您保存的凭据。然后它会自动填充(只是由于观察而猜测)最近的类似文本的输入字段,该字段出现在DOM中的密码字段之前。因为浏览器是最后一个实例,您无法控制它。

上面的这个只读修复对我有用。

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

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

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

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

添加autocomplete=“off”不会使其停止。

将输入类型属性更改为type=“search”。谷歌不会对搜索类型的输入应用自动填充。

只需设置autocomplete=“off”。这样做有一个很好的理由:您希望提供自己的自动完成功能!