快速解決input[type=file]打開時慢、卡頓的問題
為什么在input標簽類型為file上傳文件時在標簽中設置屬性 accpet="image/*",打開本地文件夾的速度特別慢?
經過測試發(fā)現,在mac里面safari、Firefox、Chrome(opera不知道為啥老閃退)都沒有卡頓問題
在windows里面,Firefox不卡頓,只有Chrome卡頓。
于是我決定先去掉accpet試試……
果然就沒有了卡頓的問題。
那么本包在試試accpet="image/jpg"果然也不卡卡的了!!
看來問題的所在就是"image/*"
但是寫accpet的原意是要想要篩選出所有圖片_(:з」∠)_
那么為了實現這個需求,同時提高用戶體驗,只能采取枚舉了
修改后的代碼
<input type ="file" accpet="image/gif,image/png,image/jpeg,image/jpg,image/bmp"/>
再試試,果然妥妥的了!
原來是因為Chrome的SafeBrowsing功能會在上傳或保存時檢查文件,
如果網絡連接到google的速度比較快呢,就沒有什么問題。
但是如果連接比較慢,或者干脆跪掉了,那SafeBrowsing就會讓Chrome掛起一段時間,直到文件檢查結束或者超時
使用accept="image/png, image/jpeg, image/gif"就可以解決這個問題,因為這些MIME類型在SafeBrowsing的白名單里面,不需要檢查。
但是如果用像是accept="image/*"這樣的呢,就不行了,就有可能變得卡卡的。
以上這篇快速解決input[type=file]打開時慢、卡頓的問題就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持我們。
欄 目:CSS/HTML
本文標題:快速解決input[type=file]打開時慢、卡頓的問題
本文地址:http://www.jygsgssxh.com/a1/CSS_HTML/9541.html
您可能感興趣的文章
- 01-10input輸入框中的光標大小顯示不一致的解決方法
- 01-10關于type="file"的input框樣式修改小結
- 01-10a標簽的背景圖在ie8下不顯示問題的解決方法
- 01-10點擊按鈕文字變成input框,點擊保存變成文字的實現代碼
- 01-10詳解HTML的&lt;input&gt; 標簽及其禁用方法
- 01-10HTML外部引用CSS文件不生效原因分析及解決辦法
- 01-10html禁止清除input文本輸入緩存的兩種方法
- 01-10淺談html中input只讀屬性readonly和disable的區(qū)別
- 01-10使用vertical-align實現input和img對齊
- 01-10修改輸入框placeholder文字默認顏色-webkit-input-placeholder方法


閱讀排行
本欄相關
- 04-02表格樣式css樣式,css樣式表單
- 04-02好看的字體樣式css,好看的字體樣式圖
- 04-02分頁樣式css,分頁樣式jq
- 04-02分頁樣式css,分頁樣式欄里用來定義首
- 04-02css樣式的引入,css樣式怎么引入
- 04-02css滾動條樣式,css滾動條的樣式
- 04-02css樣式引入方式有幾種,網頁引入css樣
- 04-02html中加入css樣式的簡單介紹
- 04-02vue中的css樣式布局,vue添加css樣式
- 04-02內嵌樣式css,內嵌樣式表,內部樣式表
隨機閱讀
- 08-05DEDECMS點擊主欄目默認顯示第一個子欄
- 01-10vue實現分頁加載效果
- 01-10C++實現將數組中的值反轉
- 01-10bat批處理徹底隱藏文件的方法(使用
- 01-10C++ 類訪問控制的條件總結
- 01-10C語言打印楊輝三角示例匯總
- 08-05織夢dedecms首頁調用縮略圖為背景
- 01-11常用的HTML富文本編譯器UEditor、CKEdi
- 08-05dedecms織夢模板編輯文檔的同時自動更
- 08-05dedecms織夢模板全站調用收藏數的方法


