為什么在input標(biāo)簽類型為file上傳文件時(shí)在標(biāo)簽中設(shè)置屬性 accpet="image/*",打開(kāi)本地文件夾的速度特別慢?
經(jīng)過(guò)測(cè)試發(fā)現(xiàn),在mac里面safari、Firefox、Chrome(opera不知道為啥老閃退)都沒(méi)有卡頓問(wèn)題
在windows里面,F(xiàn)irefox不卡頓,只有Chrome卡頓。
于是我決定先去掉accpet試試……
果然就沒(méi)有了卡頓的問(wèn)題。
那么本包在試試accpet="image/jpg"果然也不卡卡的了??!
看來(lái)問(wèn)題的所在就是"image/*"
但是寫(xiě)accpet的原意是要想要篩選出所有圖片_(:з」∠)_
那么為了實(shí)現(xiàn)這個(gè)需求,同時(shí)提高用戶體驗(yàn),只能采取枚舉了
修改后的代碼
<input type ="file" accpet="image/gif,image/png,image/jpeg,image/jpg,image/bmp"/>
再試試,果然妥妥的了!
原來(lái)是因?yàn)镃hrome的SafeBrowsing功能會(huì)在上傳或保存時(shí)檢查文件,
如果網(wǎng)絡(luò)連接到google的速度比較快呢,就沒(méi)有什么問(wèn)題。
但是如果連接比較慢,或者干脆跪掉了,那SafeBrowsing就會(huì)讓Chrome掛起一段時(shí)間,直到文件檢查結(jié)束或者超時(shí)
使用accept="image/png, image/jpeg, image/gif"就可以解決這個(gè)問(wèn)題,因?yàn)檫@些MIME類型在SafeBrowsing的白名單里面,不需要檢查。
但是如果用像是accept="image/*"這樣的呢,就不行了,就有可能變得卡卡的。
以上這篇快速解決input[type=file]打開(kāi)時(shí)慢、卡頓的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。