我有设计问题与谷歌Chrome浏览器和它的形式自动填充功能。 如果Chrome记住了一些登录/密码,它会将背景颜色更改为黄色。
以下是一些截图:
如何删除背景或只是禁用这个自动填充?
我有设计问题与谷歌Chrome浏览器和它的形式自动填充功能。 如果Chrome记住了一些登录/密码,它会将背景颜色更改为黄色。
以下是一些截图:
如何删除背景或只是禁用这个自动填充?
当前回答
将“白色”改为任何你想要的颜色。
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px white inset !important;
}
其他回答
没有一个解决方案对我有效,用户名和密码输入仍然在填充,并给出黄色背景。
所以我问自己,“Chrome如何决定在给定的页面上应该自动填充什么?”
“它会查找输入id、输入名称吗?”表单的id吗?表单动作?”
通过我对用户名和密码输入的实验,我发现只有两种方法会导致Chrome无法找到应该自动填充的字段:
1)将密码输入放在文本输入之前。 2)给他们相同的名字和身份证……或者没有姓名和身份证。
页面加载后,用javascript你可以改变页面上输入的顺序,或者动态地给他们他们的名字和id…
Chrome不知道是什么击中了它…自动完成关闭。
疯狂的黑客,我知道。但这对我很有用。
Chrome 34.0.1807.116, OSX 10.7.5
我用这个,
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; }
input:focus:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; }
/* You can use color:#color to change the color */
阿尔扬斯解决方案的更新。当试图改变值时,它不会让你。这对我来说很好。当你聚焦于一个输入时,它就会变黄。够近了。
$(document).ready(function (){
if(navigator.userAgent.toLowerCase().indexOf("chrome") >= 0 || navigator.userAgent.toLowerCase().indexOf("safari") >= 0){
var id = window.setInterval(function(){
$('input:-webkit-autofill').each(function(){
var clone = $(this).clone(true, true);
$(this).after(clone).remove();
});
}, 20);
$('input:-webkit-autofill').focus(function(){window.clearInterval(id);});
}
});
$('input:-webkit-autofill').focus(function(){window.clearInterval(id);});
将“白色”改为任何你想要的颜色。
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px white inset !important;
}
我也有同样的问题。这对我来说很管用:
form :focus {
outline: none;
}