有時候我們會遇到這樣的問題,就是在輸入密碼的時候後面有個小眼睛,點選這個小眼睛就可以顯示密碼明文或省略號,那麼這個是怎麼實現的呢?來看看小編的js怎麼修改input的type屬性ie不出錯介紹吧。
工具/原料
Dreamweaver 編輯軟體
方法/步驟
首先我們來做一個html頁面,來模擬這個密碼框,這個圖示找的不好,就用小箭頭代替小眼睛了。
那麼怎麼實現點選小眼睛顯示明文密碼呢?小編的思路是改變input的type型別,預設是password型別,點選小眼睛變為text型別,反之亦然。
一般的思路就是這樣,但是ie8會出現錯誤,提示type型別不可以改變,這該怎麼辦呢?
這時候我們可以換個思路,既然改變不了他type型別,那麼不妨改變這個input框,在點選小眼睛的時候換掉input不就行了嗎?再點選的時候再換回來,記得儲存input的value值。
還有一種方法也可以,直接寫兩個input框,一個text型別,一個password型別,點選小眼睛的時候顯示不同的輸入框就行了,也是記得儲存value值。
注意事項
如果非要相容ie,那麼貌似上面的方法可以試試。