消除瀏覽器對input輸入框的自動填充

Mozilla官方文檔建議的是 直接使用 autocomplete = ‘off’ 即可禁止輸入框從瀏覽器cache獲取數據，博主以前使用這個也就足夠兼容瀏覽器了。

現在發現，卻在chrome、firfox上有兼容性 無法解決。

后來查閱相關資料得到以下解決方法：

1：可以設置一個默認的input用來接收瀏覽器的默認填充，並且設置css為dispaly：none

形如：

<input type = 'text' style='display:none'>

這樣既不會影響用戶的體驗，也可以兼容所有的瀏覽器，但經過測試卻發現，在chrome上不起作用，在firefox上也只能對type != password的 輸入框起作用。

2：autocomplete = 'new-password'

<input type='text' >
<input type='password' autocomplete='new-password' >

使用上訴代碼，在chrome上既可生效，用戶名與密碼都不會自動填充，但是firefox上任然會自動填充用戶名

3：結合上訴兩個情況

<input type='text' style='display:none'> <!-- 針對firefox -->
用戶名：<input type='text' autocomplete='off'> 
密碼：<input type='password' autocomplete='new-password'>

既可解決針對chrome與firefox內核的瀏覽器自動填充輸入框的問題

4：但是近期經過測試發現 這種方法還是不能解決firefox上密碼框的歷史輸入，可以:3步驟上做這樣的操作：

<input type='password' autocomplete="new-password" style="background-color: #FFFFFF!important;" readonly onfocus="this.removeAttribute('readonly');" onblur="this.setAttribute('readonly',true);" />>