摘要:讓看不見,而不是直接,如果直接,有些瀏覽器則不生效,比如谷歌修改屬性將表單輸入設(shè)為可讀模式,瀏覽器自動填充就失效了,在焦點在該表單輸入的時候再將可讀屬性移除。
問題描述
話說有一天,我如往常一樣打開我的開發(fā)網(wǎng)站進行登錄操作。瀏覽器很平常的在我們進行登錄操作之后詢問我是否需要記住密碼,懶惰如我點擊了記住密碼。一切都很正常的進行著,沒有什么異常發(fā)生。然而,問題就出現(xiàn)了。當我打開一個新建用戶的操作,里面的輸入框自動將我的用戶名和密碼默認填寫進去了,然后觸發(fā)了內(nèi)置的校驗規(guī)則
在我確認過在打開編輯框的時候已經(jīng)輸入框的數(shù)據(jù)重置之后,開始了我的排查錯位之旅。從cookie,本地緩存等等,都沒有發(fā)現(xiàn)相關(guān)的問題。后來發(fā)現(xiàn)是瀏覽器存在自動填充機制的問題。
瀏覽器自動填充機制經(jīng)過我的反復測試,以Chrome為例,當瀏覽器遇到type="text"與type="password"的標簽緊鄰時,會觸發(fā)瀏覽器自動填充行為。默認為黃色背景。firefox和360瀏覽器的處理方式是:只要檢測到頁面里有滿足填充機制的,不管是不是display:none 的,只要檢測到就直接往里填充。
解決方案設(shè)置瀏覽器不提示記住密碼,記住密碼的網(wǎng)站都在設(shè)置里可以看到,并且可以去除(很明顯,這個方法治標不治本,我就想記住密碼還不行嗎?)
2.使用HTML5新屬性autocomplete="off" 但禁用自動填充。這個屬性好像是firefox發(fā)起的,并不是標準屬性,所以這塊主要是針對ie和獲取瀏覽器生效。谷歌不承認這個屬性。所以在谷歌瀏覽器上并沒有產(chǎn)生任何效果
3.既然瀏覽器遇到type="text"與type="password"的標簽緊鄰時觸發(fā)自動填充行為,則將兩個隔開,使用隱藏的方式“欺騙”瀏覽器,將密碼信息填寫在隱藏區(qū)域。
.is-hidden { position: absolute; left: -10000px; top: -10000px; }
/*讓input看不見,而不是直接display: none,如果直接display: none,有些瀏覽器則不生效,比如谷歌*/
4.修改readonly屬性
將表單輸入設(shè)為可讀模式,瀏覽器自動填充就失效了,在焦點在該表單輸入的時候再將可讀屬性移除。該方法親試簡潔好用
總結(jié)在以上介紹的方法并不是全部的解決方法,目前我用的是第四個方法比較多,雖然第三個方法也挺好用,但是多增加標簽的類型不符合我的作風,還是默默的用了第四種方法。歡迎大家補充更多的一些方法,未完待續(xù)!
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/102175.html
摘要:解決瀏覽器保存密碼自動填充問題問題描述話說有一天,我如往常一樣打開我的開發(fā)網(wǎng)站進行登錄操作。后來發(fā)現(xiàn)是瀏覽器存在自動填充機制的問題。 解決瀏覽器保存密碼自動填充問題 問題描述 話說有一天,我如往常一樣打開我的開發(fā)網(wǎng)站進行登錄操作。瀏覽器很平常的在我們進行登錄操作之后詢問我是否需要記住密碼,懶惰如我點擊了記住密碼。一切都很正常的進行著,沒有什么異常發(fā)生。然而,問題就出現(xiàn)了。當我打開一個新...
摘要:讓看不見,而不是直接,如果直接,有些瀏覽器則不生效,比如谷歌修改屬性將表單輸入設(shè)為可讀模式,瀏覽器自動填充就失效了,在焦點在該表單輸入的時候再將可讀屬性移除。 問題描述 話說有一天,我如往常一樣打開我的開發(fā)網(wǎng)站進行登錄操作。瀏覽器很平常的在我們進行登錄操作之后詢問我是否需要記住密碼,懶惰如我點擊了記住密碼。一切都很正常的進行著,沒有什么異常發(fā)生。然而,問題就出現(xiàn)了。當我打開一個新建用戶...
摘要:問題描述在瀏覽器中進行登錄操作時瀏覽器往往會問我們是否需要記住密碼,當我們點擊了記住密碼后,發(fā)現(xiàn)瀏覽器會自動填充此域名下已經(jīng)保存的賬號密碼,給用戶帶來不便。 問題描述 在瀏覽器中進行登錄操作時瀏覽器往往會問我們是否需要記住密碼,當我們點擊了記住密碼后,發(fā)現(xiàn)瀏覽器會自動填充此域名下已經(jīng)保存的賬號密碼,給用戶帶來不便。加了HTML5 中的新屬性autocomplete=off ,但是并沒有...
摘要:問題描述在瀏覽器中進行登錄操作時瀏覽器往往會問我們是否需要記住密碼,當我們點擊了記住密碼后,發(fā)現(xiàn)瀏覽器會自動填充此域名下已經(jīng)保存的賬號密碼,給用戶帶來不便。 問題描述 在瀏覽器中進行登錄操作時瀏覽器往往會問我們是否需要記住密碼,當我們點擊了記住密碼后,發(fā)現(xiàn)瀏覽器會自動填充此域名下已經(jīng)保存的賬號密碼,給用戶帶來不便。加了HTML5 中的新屬性autocomplete=off ,但是并沒有...
摘要:所以,這里給設(shè)置初始為,在用戶點擊聚焦后設(shè)置為,避免瀏覽器在頁面之后判斷登錄表單進行回填。 本文由 Deguang 發(fā)表于 碼路-技術(shù)博客 瀏覽器的保存賬戶密碼功能,給我們帶來了很大的便利,但是在有些情況下,我們并不希望瀏覽器幫我們填充一些表單,然而autocomplete的一些參數(shù)項并不能阻止瀏覽器回填,這里我們來看下如何解決這個問題。 問題描述: 項目注冊部分的表單有三項,分別為手...
閱讀 2013·2021-09-30 09:53
閱讀 1854·2021-09-24 09:48
閱讀 1765·2019-08-30 14:01
閱讀 2176·2019-08-29 18:35
閱讀 1257·2019-08-26 18:27
閱讀 2987·2019-08-26 12:12
閱讀 955·2019-08-23 17:16
閱讀 950·2019-08-23 15:31