我创建了一个使用标签框下拉的web应用程序。除了Chrome浏览器(Version 21.0.1180.89),这在所有浏览器中都很有效。

尽管输入字段和表单字段都有autocomplete="off"属性,Chrome坚持显示该字段以前条目的下拉历史,这是删除标签框列表。


当前回答

以下是我在Chrome版本51.0.2704.106上的工作方式。<input id="user_name" type="text" name="user_name" autocomplete="off" required /> And in combination with <input id="user_password" type="password" name="user_password" autocomplete="new-password" required />。我的问题是,在实现new-password之后,它仍然会在user_name字段上显示用户名的下拉列表。

其他回答

现代的方法

简单地使你的输入为只读,然后聚焦,删除它。这是一种非常简单的方法,浏览器不会填充只读输入。因此,此方法被接受,并且永远不会被将来的浏览器更新覆盖。

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

下一部分是可选的。相应地设置输入样式,使其看起来不像只读输入。

input[readonly] {
     cursor: text;
     background-color: #fff;
}

工作示例

更新

现在Chrome似乎忽略了style="display: none;"或style="visibility: hidden; "属性。

你可以把它改成这样:

<input style="opacity: 0;position: absolute;">
<input type="password" style="opacity: 0;position: absolute;">

根据我的经验,Chrome只自动完成第一个<input type="password">和前一个<input>。所以我添加了:

<input style="display:none">
<input type="password" style="display:none">

到<form>的顶部,该情况得到解决。

我刚刚尝试了下面的方法,它似乎在Chrome 53上起了作用——当输入密码字段时,它还禁用了“使用密码用于:”下拉菜单。

简单地设置你的密码输入类型为文本,然后添加onfocus处理程序(内联或通过jQuery/vanilla JS)来设置类型为密码:

onfocus="this.setAttribute('type','password')"

或者更好:

onfocus="if(this.getAttribute('type')==='text') this.setAttribute('type','password')"

这些方法都不再工作,chrome忽略所有这些属性,唯一的解决方案是使用jquery

在输入上使用这个

< onclick输入=“$”.removeAttr(readonly);attr(“readonly”,true);“readonly />

浏览器不关心自动完成=关闭自动,甚至填充凭据到错误的文本字段?

我通过将密码字段设置为只读并激活它来修复它,当用户单击进入它或使用tab键到该字段时。

修复浏览器自动填充:只读和设置可写的焦点(在鼠标点击和标签通过字段)

 <input type="password" readonly  
     onfocus="$(this).removeAttr('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/

/ / UpdateEnd

顺便说一下,更多关于我观察到的信息:

Sometimes I notice this strange behavior on Chrome and Safari, when there are password fields in the same form. I guess, the browser looks for a password field to insert your saved credentials. Then it autofills username into the nearest textlike-input field , that appears prior the password field in DOM (just guessing due to observation). As the browser is the last instance and you can not control it, sometimes even autocomplete=off would not prevent to fill in credentials into wrong fields, but not user or nickname field.