我创建了一个使用标签框下拉的web应用程序。除了Chrome浏览器(Version 21.0.1180.89),这在所有浏览器中都很有效。
尽管输入字段和表单字段都有autocomplete="off"属性,Chrome坚持显示该字段以前条目的下拉历史,这是删除标签框列表。
我创建了一个使用标签框下拉的web应用程序。除了Chrome浏览器(Version 21.0.1180.89),这在所有浏览器中都很有效。
尽管输入字段和表单字段都有autocomplete="off"属性,Chrome坚持显示该字段以前条目的下拉历史,这是删除标签框列表。
当前回答
直到上周,以下两种解决方案似乎都适用于Chrome、IE和Firefox。但随着Chrome 48版的发布(仍然是49版),它们不再适用:
表格顶部有以下内容:
<input style="display:none" type="text" name="fakeUsername"/>
<input style="display:none" type="password" name="fakePassword"/>
在密码输入元素中: 自动完成=“关闭”
因此,为了快速解决这个问题,我首先尝试使用一个主要的hack,即最初将密码输入元素设置为禁用,然后在document ready函数中使用setTimeout再次启用它。
setTimeout(function(){$('#PasswordData').prop('disabled', false);}, 50);
但这似乎太疯狂了,我做了更多的搜索,在禁用Chrome自动填充中找到了@tibalts的答案。他的答案是在密码输入中使用autocomplete="new-password",这似乎在所有浏览器上都可以工作(在这个阶段,我保留了上面的修复程序1)。
下面是谷歌Chrome开发者讨论中的链接: https://code.google.com/p/chromium/issues/detail?id=370363#c7
其他回答
在chrome v. 34之后,在<form>标记处设置autocomplete="off"不起作用
我做这些改变是为了避免这种恼人的行为:
删除密码输入的名称和id 在输入中放入一个类(例如:passwordInput)
(到目前为止,Chrome不会把保存的密码输入,但形式现在是破碎的)
最后,为了让表单工作,当用户点击提交按钮时,或者当你想触发表单提交时,运行以下代码:
var sI = $(".passwordInput")[0];
$(sI).attr("id", "password");
$(sI).attr("name", "password");
在我的情况下,我曾经在密码输入中有id="password" name="password",所以我在触发提交之前把它们放回去。
你可以使用下面的概念来实现AutoComplete='false' chrome以及其他浏览器。取一个虚拟输入类型,它的不透明度为0。默认chrome浏览器已经触发第一个已经隐藏。
<input style="opacity: 0; position: absolute; z-index: -1;" name="email">
<input type="search" name="email" class="form-control" autocomplete="new-email" id="email">
Chrome一直在改变它在每个版本上处理自动完成的方式,我提出的方式是,使字段只读和onclick/focus使它非只读。试试这个jQuery片段。
jQuery(document).ready(function($){
//======fix for autocomplete
$('input, :input').attr('readonly',true);//readonly all inputs on page load, prevent autofilling on pageload
$('input, :input').on( 'click focus', function(){ //on input click
$('input, :input').attr('readonly',true);//make other fields readonly
$( this ).attr('readonly',false);//but make this field Not readonly
});
//======./fix for autocomplete
});
在Chrome 48+使用这个解决方案:
Put fake fields before real fields: <form autocomplete="off"> <input name="fake_email" class="visually-hidden" type="text"> <input name="fake_password" class="visually-hidden" type="password"> <input autocomplete="off" name="email" type="text"> <input autocomplete="off" name="password" type="password"> </form> Hide fake fields: .visually-hidden { margin: -1px; padding: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip: rect(0, 0, 0, 0); position: absolute; } You did it!
同样,这也适用于旧版本。
我最近遇到了这个问题,没有一个答案对我有用。在我的情况下,因为我不关心输入字段内嵌套的“形式”标签,我通过提供一个空的数据表输入修复chrome自动补全问题。所以现在chrome应该为你提供自动完成建议从“数据列表”是空的。请记住,如果输入嵌套在“form”标记中,此解决方案将不起作用。令人惊讶的是,除了这个技巧,其他什么都不管用。
<input type="text" autocomplete="off" list="emptyList" />
<datalist id="emptyList"></datalist>
你可以在这里了解更多关于数据列表的信息: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist
考虑到浏览器兼容性,使用它似乎是安全的。