我有2種基本表單-登錄和注冊，都在同一頁面上?，F在，我可以自動填寫表單登錄了，但是注冊表單也會自動填寫，我不喜歡它。此外，表單樣式的背景為黃色，我無法覆蓋它，也不想使用內聯CSS來實現。我該怎么辦才能使它們停止變為黃色和（可能）自動填充？提前致謝！
3 回答
POPMUISE
TA貢獻1765條經驗 獲得超5個贊
對于自動完成，可以使用：
<form autocomplete="off">
關于著色問題：
從屏幕截圖中，我可以看到該webkit生成以下樣式：
input:-webkit-autofill {
background-color: #FAFFBD !important;
}
1）由于#id樣式比.class樣式更為重要，因此可以使用以下方法：
#inputId:-webkit-autofill {
background-color: white !important;
}
2）如果不起作用，您可以嘗試以編程方式通過javascript設置樣式
$("input[type='text']").bind('focus', function() {
$(this).css('background-color', 'white');
});
3）如果那行不通，那就注定了:-)：這不會隱藏黃色，但是會使文本再次可讀。
input:-webkit-autofill {
color: #2a2a2a !important;
}
4）CSS / JavaScript解決方案：
CSS：
input:focus {
background-position: 0 0;
}
并且以下javascript必須在加載時運行：
function loadPage()
{
if (document.login)//if the form login exists, focus:
{
document.login.name.focus();//the username input
document.login.pass.focus();//the password input
document.login.login.focus();//the login button (submitbutton)
}
}
例如：
<body onload="loadPage();">
祝好運 ：-）
5）如果上述任何一項均未嘗試刪除輸入元素，將其克隆，然后將克隆的元素放回到頁面上（在Safari 6.0.3上可用）：
<script>
function loadPage(){
var e = document.getElementById('id_email');
var ep = e.parentNode;
ep.removeChild(e);
var e2 = e.cloneNode();
ep.appendChild(e2);
var p = document.getElementById('id_password');
var pp = p.parentNode;
pp.removeChild(p);
var p2 = p.cloneNode();
pp.appendChild(p2);
}
document.body.onload = loadPage;
</script>
6）從這里：
if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) {
$(window).load(function(){
$('input:-webkit-autofill').each(function(){
var text = $(this).val();
var name = $(this).attr('name');
$(this).after(this.outerHTML).remove();
$('input[name=' + name + ']').val(text);
});
});
}
慕絲7291255
TA貢獻1859條經驗 獲得超6個贊
使用“強烈”的內部陰影來欺騙它：
input:-webkit-autofill {
-webkit-box-shadow:0 0 0 50px white inset; /* Change the color to your own background color */
-webkit-text-fill-color: #333;
}
input:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0 50px white inset;/*your box-shadow*/
-webkit-text-fill-color: #333;
}
幕布斯6054654
TA貢獻1876條經驗 獲得超7個贊
經過2個小時的搜索，看來Google Chrome瀏覽器仍然可以覆蓋黃色，但是我找到了解決方法。它也將適用于懸停，聚焦等。您所要做的就是添加!important它。
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0px 1000px white inset !important;
}
這將完全消除輸入字段中的黃色
- 3 回答
- 0 關注
- 673 瀏覽
相關問題推薦
添加回答
舉報
0/150
提交
取消