上传文件响应慢的处理方法

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