首頁  >  文章  >  web前端  >  input[type=file]開啟時慢、卡頓問題的解決方法

input[type=file]開啟時慢、卡頓問題的解決方法

巴扎黑
巴扎黑原創
2017-08-12 15:06:392330瀏覽

下面小編就為大家帶來一篇下面小編就為大家帶來一篇快速解決input[type=file]打開時慢、卡頓的問題。小編覺得蠻不錯的,現在就分享給大家,也給大家做個參考。一起跟著小編過來看看吧

為什麼在input標籤類型為file上傳檔案時在標籤中設定屬性accpet="image/*"#,打開本地資料夾的速度特別慢?

經過測試發現,在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]開啟時慢、卡頓問題的解決方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn