去除輸入框input的緩存提示、自動填充

1.input框的緩存提示

input的緩存提示

清除方法:

  1. 在不想使用緩存的input中添加 autocomplete=“off”;
  2. 在 input 所在的form標籤中添加 autocomplete=“off”;

2.input框的自動填充

input的自動填充

當“密碼”那項input的type改成password的時候
chrome瀏覽器對type="password"進行了識別,並把"密碼"項進行了填充,並且把"密碼"項前面input當成了"賬號"項進行了填充

  1. 去除自動填充解決辦法是,添加兩個隱藏的input框,第二個type爲password
<label style="display:none;"><span></span><input type="text" name="hidden1" ></label>
<label style="display:none;"><span></span><input type="password" name="hidden2" ></label>
  1. 修改填充背景顏色
input[type="text"] {
    border: 1px solid #333333 !important;
    padding: 0px 12px 0px 32px;
    background: transparent !important;
}
input[type="password"] {
    border: 1px solid #333333 !important;
    padding: 0px 12px 0px 32px;
    background: transparent !important;
}

@-webkit-keyframes autofill {
    to {
        color: #666;
        background: transparent;
    }
}

input:-webkit-autofill {
    animation-name: autofill !important;
    animation-fill-mode: both !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    background-clip: content-box !important;
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章