上傳文件響應慢的處理方法

input[file]標簽的 accept 屬性可用於指定上傳文件的 MIME 類型。
例如，想要實現默認上傳圖片文件的代碼，代碼可如下：

<input type="file" name="file" class="element" accept="image/*">

效果如下圖所示，默認過濾掉所有非圖片文件：

 

但是！
這段代碼在 Chrome 和 Safar i等 Webkit 瀏覽器下卻出現了響應滯慢的問題，可能要等 6~10s 才能彈出文件選擇對話框。簡直不能忍呀。
在 IE 和 Firefox 中使用 accept="image/*" 屬性則沒有發現響應延遲的問題。
於是幾經嘗試后，發現是 accept="image/*" 屬性的問題，刪掉它 或者 將 * 通配符 修改為指定的 MIME 類型，就可以解決 Webkit 瀏覽器下的對話框顯示滯慢的問題。

解決辦法如下：

<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png">

accept="image/*" 屬性會對每一個文件都遍歷一次所有的 "image/*" 文件類型，當文件較多時，文件的檢驗時間較長，這可能是Webkit的底層實現的bug。
另外，accept="audio/*" 和 accept="video/*" 屬性 在 Webkit 瀏覽器下也會有同樣的響應延遲的問題。同理，通過 將 * 通配符 修改成指定的MIME類型就可解決。

需要注意的是：
當form表單含有file文件類型的話，需要將form表單的屬性加上 enctype="multipart/form-data"

accept可接受的屬性(部分)：

后綴名 MIME名稱 *.3gpp      audio/3gpp, video/3gpp *.ac3       audio/ac3 *.asf       allpication/vnd.ms-asf *.au        audio/basic *.css       text/css *.csv       text/csv *.doc       application/msword *.dot       application/msword *.dtd       application/xml-dtd *.dwg       image/vnd.dwg *.dxf       image/vnd.dxf *.gif       image/gif *.htm       text/html *.html      text/html *.jp2       image/jp2 *.jpe       image/jpeg *.jpeg      image/jpeg *.jpg       image/jpeg *.js        text/javascript, application/javascript *.json      application/json *.mp2       audio/mpeg, video/mpeg *.mp3       audio/mpeg *.mp4       audio/mp4, video/mp4 *.mpeg      video/mpeg *.mpg       video/mpeg *.mpp       application/vnd.ms-project *.ogg       application/ogg, audio/ogg *.pdf       application/pdf *.png       image/png *.pot       application/vnd.ms-powerpoint *.pps       application/vnd.ms-powerpoint *.ppt       application/vnd.ms-powerpoint *.rtf       application/rtf, text/rtf *.svf       image/vnd.svf *.tif       image/tiff *.tiff      image/tiff *.txt       text/plain *.wdb       application/vnd.ms-works *.wps       application/vnd.ms-works *.xhtml     application/xhtml+xml *.xlc       application/vnd.ms-excel *.xlm       application/vnd.ms-excel *.xls       application/vnd.ms-excel *.xlt       application/vnd.ms-excel *.xlw       application/vnd.ms-excel *.xml       text/xml, application/xml *.zip       aplication/zip *.xlsx      application/vnd.openxmlformats-officedocument.spreadsheetml.sheet