我创建了一个使用标签框下拉的web应用程序。除了Chrome浏览器(Version 21.0.1180.89),这在所有浏览器中都很有效。
尽管输入字段和表单字段都有autocomplete="off"属性,Chrome坚持显示该字段以前条目的下拉历史,这是删除标签框列表。
我创建了一个使用标签框下拉的web应用程序。除了Chrome浏览器(Version 21.0.1180.89),这在所有浏览器中都很有效。
尽管输入字段和表单字段都有autocomplete="off"属性,Chrome坚持显示该字段以前条目的下拉历史,这是删除标签框列表。
当前回答
对任何想要解决这个问题的人来说,我终于明白了。
Chrome只服从的自动完成="off"如果页面是HTML5页面(我使用XHTML)。
我把我的页面转换成HTML5,问题就消失了(捂脸)。
其他回答
2021答: 可悲的是,唯一有效的东西都是令人作呕的俗气。我的解决方案是在生成前端标记时,在name属性的末尾添加一个动态生成的随机数(例如<input name="postcode-22643"…)这对浏览器来说是一种欺骗。
然后需要在服务器端添加一些东西来清理传入的post请求。例如,在NodeJS / Express中,我放入了一个中间件,并使用了一些正则表达式来从收到的post请求中删除数字段。我的是这样的,但我想在其他语言中也会有类似的东西:
const cleanseAutosuggest = function (req, res, next) {
for (const key in req.body) {
if (key.match(/-\d+/)) {
req.body[key.replace(/-\d+/, "")] = req.body[key];
delete req.body[key];
}
}
next();
};
app.post("/submit", cleanseAutosuggest, function (req, res, next) {
...
})
我不得不在drupal页面上用一个巨大的webform来解决这个问题。因为我不能编辑每个输入的html代码,所以我想出了下面的通用jQuery解决方案。
<script>
// Form Autocomplete FIX
function is_mobile() {
if( screen.width < 500 || navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i) ) {
return true;
}
return false;
}
jQuery( 'input[autocomplete="off"]' ).each( function() {
if( is_mobile() ) {
return;
}
jQuery( this ).attr( 'readonly', true );
} );
jQuery( 'input[autocomplete="off"]' ).focus( function() {
if( is_mobile() ) {
return;
}
jQuery( this ).removeAttr( 'readonly' );
jQuery( this ).focus();
} );
jQuery( 'input[autocomplete="off"]' ).blur( function() {
if( is_mobile() ) {
return;
}
jQuery( this ).attr( 'readonly', true );
} );
</script>
浏览器检测从这里开始。
我想有可能优化这段代码(我很想获得一些建议),但您将从中获得想法。
基本上我们可以摆脱任何文本框的自动完成从chrome, firefox或任何类型的浏览器。这是简单的javascript。
window.onload=function(){
setTimeout(function(){
document.getElementById('username').value = '';
document.getElementById('password').value = '';
},100);
}
当你的窗口完成加载,100毫秒后,我们的用户名和密码字段的值将被删除。 我认为这是最好的方法做自动完成在所有浏览器(特别是chrome)。
一些2020年底更新。我尝试了不同网站上的所有老方法。没有一个成功!: - ( 然后我发现了这个: 使用
<input type="search"/>
自动补全功能消失了!
Chrome 86, FireFox, Edge 87都成功了。
我发现了一个窍门:
<input type="password" id="some_id" name="some_name" value=" " placeholder="Password">
<script>
$(function)
{
$("#some_id").val("");
}
</script>
注意,value是空格。它防止自动堆积在Chrome和输入字段显示占位符。