文件input“接受”属性 – 是否有用？
在html下实现file upload相当简单，但我注意到有一个'accept'属性可以添加到<input type="file" ...>标记中。
这个属性是否有用作为限制file upload到图像等方式？ 什么是使用它的最好方法？
另外，有没有办法限制文件types，最好是在文件对话框中，为html文件input标签？
accept属性是非常有用的。 浏览器只显示当前input允许的文件。 虽然通常可以被用户覆盖，但是它有助于缩小用户默认的search结果范围，以便在不需要筛选上百种不同的文件types的情况下准确地find他们想要的内容。
用法
注意：这些示例是基于当前的规范编写的，可能不适用于所有（或任何）浏览器。 规范也可能在将来发生变化，这可能会打破这些例子。
h1 { font-size: 1em; margin:1em 0; } h1 ~ h1 { border-top: 1px solid #ccc; padding-top: 1em; }
<h1>Match all image files (image/*)</h1> <p><label>image/* <input type="file" accept="image/*"></label></p> <h1>Match all video files (video/*)</h1> <p><label>video/* <input type="file" accept="video/*"></label></p> <h1>Match all audio files (audio/*)</h1> <p><label>audio/* <input type="file" accept="audio/*"></label></p> <h1>Match all image files (image/*) and files with the extension ".someext"</h1> <p><label>.someext,image/* <input type="file" accept=".someext,image/*"></label></p> <h1>Match all image files (image/*) and video files (video/*)</h1> <p><label>image/*,video/* <input type="file" accept="image/*,video/*"></label></p>
是的，它在支持它的浏览器中是非常有用的，但是“限制”对于用户来说是一种方便（所以它们不会被不相关的文件所淹没），而不是阻止他们上传你不想要的东西上传。
它被支持
- Chrome 16 +
- Safari 6 +
- Firefox 9 +
- IE 10 +
- 歌剧11 +
以下是可以使用的内容types列表 ，后跟相应的文件扩展名（当然，您可以使用任何文件扩展名）：
application/envoy evy application/fractals fif application/futuresplash spl application/hta hta application/internet-property-stream acx application/mac-binhex40 hqx application/msword doc application/msword dot application/octet-stream * application/octet-stream bin application/octet-stream class application/octet-stream dms application/octet-stream exe application/octet-stream lha application/octet-stream lzh application/oda oda application/olescript axs application/pdf pdf application/pics-rules prf application/pkcs10 p10 application/pkix-crl crl application/postscript ai application/postscript eps application/postscript ps application/rtf rtf application/set-payment-initiation setpay application/set-registration-initiation setreg application/vnd.ms-excel xla application/vnd.ms-excel xlc application/vnd.ms-excel xlm application/vnd.ms-excel xls application/vnd.ms-excel xlt application/vnd.ms-excel xlw application/vnd.ms-outlook msg application/vnd.ms-pkicertstore sst application/vnd.ms-pkiseccat cat application/vnd.ms-pkistl stl application/vnd.ms-powerpoint pot application/vnd.ms-powerpoint pps application/vnd.ms-powerpoint ppt application/vnd.ms-project mpp application/vnd.ms-works wcm application/vnd.ms-works wdb application/vnd.ms-works wks application/vnd.ms-works wps application/winhlp hlp application/x-bcpio bcpio application/x-cdf cdf application/x-compress z application/x-compressed tgz application/x-cpio cpio application/x-csh csh application/x-director dcr application/x-director dir application/x-director dxr application/x-dvi dvi application/x-gtar gtar application/x-gzip gz application/x-hdf hdf application/x-internet-signup ins application/x-internet-signup isp application/x-iphone iii application/x-javascript js application/x-latex latex application/x-msaccess mdb application/x-mscardfile crd application/x-msclip clp application/x-msdownload dll application/x-msmediaview m13 application/x-msmediaview m14 application/x-msmediaview mvb application/x-msmetafile wmf application/x-msmoney mny application/x-mspublisher pub application/x-msschedule scd application/x-msterminal trm application/x-mswrite wri application/x-netcdf cdf application/x-netcdf nc application/x-perfmon pma application/x-perfmon pmc application/x-perfmon pml application/x-perfmon pmr application/x-perfmon pmw application/x-pkcs12 p12 application/x-pkcs12 pfx application/x-pkcs7-certificates p7b application/x-pkcs7-certificates spc application/x-pkcs7-certreqresp p7r application/x-pkcs7-mime p7c application/x-pkcs7-mime p7m application/x-pkcs7-signature p7s application/x-sh sh application/x-shar shar application/x-shockwave-flash swf application/x-stuffit sit application/x-sv4cpio sv4cpio application/x-sv4crc sv4crc application/x-tar tar application/x-tcl tcl application/x-tex tex application/x-texinfo texi application/x-texinfo texinfo application/x-troff roff application/x-troff t application/x-troff tr application/x-troff-man man application/x-troff-me me application/x-troff-ms ms application/x-ustar ustar application/x-wais-source src application/x-x509-ca-cert cer application/x-x509-ca-cert crt application/x-x509-ca-cert der application/ynd.ms-pkipko pko application/zip zip audio/basic au audio/basic snd audio/mid mid audio/mid rmi audio/mpeg mp3 audio/x-aiff aif audio/x-aiff aifc audio/x-aiff aiff audio/x-mpegurl m3u audio/x-pn-realaudio ra audio/x-pn-realaudio ram audio/x-wav wav image/bmp bmp image/cis-cod cod image/gif gif image/ief ief image/jpeg jpe image/jpeg jpeg image/jpeg jpg image/pipeg jfif image/svg+xml svg image/tiff tif image/tiff tiff image/x-cmu-raster ras image/x-cmx cmx image/x-icon ico image/x-portable-anymap pnm image/x-portable-bitmap pbm image/x-portable-graymap pgm image/x-portable-pixmap ppm image/x-rgb rgb image/x-xbitmap xbm image/x-xpixmap xpm image/x-xwindowdump xwd message/rfc822 mht message/rfc822 mhtml message/rfc822 nws text/css css text/h323 323 text/html htm text/html html text/html stm text/iuls uls text/plain bas text/plain c text/plain h text/plain txt text/richtext rtx text/scriptlet sct text/tab-separated-values tsv text/webviewhtml htt text/x-component htc text/x-setext etx text/x-vcard vcf video/mpeg mp2 video/mpeg mpa video/mpeg mpe video/mpeg mpeg video/mpeg mpg video/mpeg mpv2 video/quicktime mov video/quicktime qt video/x-la-asf lsf video/x-la-asf lsx video/x-ms-asf asf video/x-ms-asf asr video/x-ms-asf asx video/x-msvideo avi video/x-sgi-movie movie x-world/x-vrml flr x-world/x-vrml vrml x-world/x-vrml wrl x-world/x-vrml wrz x-world/x-vrml xaf x-world/x-vrml xof
Accept属性是在RFC 1867中引入的，旨在为文件select控件启用基于MIMEtypes的文件types过滤。 但是截至2008年，大部分（如果不是全部的话）浏览器都没有使用这个属性。 使用客户端脚本，您可以进行一种基于扩展的validation，以提交正确types（扩展名）的数据。
其他用于高级file upload的解决scheme需要像SWFUpload或Java小程序（如JUpload）的 Flash电影。
在2015年，我发现让Chrome和Firefox都能正常工作的唯一方法就是将所有可能的扩展插入到你想要的支持中：
accept=".jpeg, .jpg, .jpe, .jfif, .jif"
问题与FF ：使用image/jpeg mimetypesFireFox将只显示.jpg文件，非常奇怪，就好像常见的.jpeg不正常…
无论你做什么，一定要尝试与许多不同的扩展名的文件。 也许它甚至取决于操作系统…
我认为accept不区分大小写，但可能不是在每个浏览器中。
它受到Chrome的支持。 它不应该用于validation，而是用于提示操作系统。 如果在file upload中有一个accept="image/jpeg"属性，则操作系统只能显示build议types的文件。
已经有几年了，Chrome至less利用了这个属性。 从可用性的angular度来看，这个属性是非常有用的，因为它会为用户过滤掉不必要的文件，使他们的体验变得更加stream畅。 但是，用户仍然可以从types中select“所有文件”（否则绕过filter），因此您应该始终validation文件实际使用的位置; 如果您在服务器上使用它，请在使用之前对其进行validation。 用户总是可以绕过任何客户端脚本。
如果浏览器使用这个属性，它只是作为用户的帮助，所以他不会上传一个多兆字节的文件，只是为了看到它拒绝服务器…
相同的为<input type="hidden" name="MAX_FILE_SIZE" value="100000">标记：如果浏览器使用它，它将不会发送该文件，但会导致PHP中的UPLOAD_ERR_FORM_SIZE （2）错误的错误确定如何处理其他语言）。
注意这些对用户有帮助。 当然，服务器必须始终检查文件的types和大小：在客户端很容易篡改这些值。
早在2008年，由于缺乏移动操作系统，这一点并不重要，但现在相当重要。
当你设置接受的MIMEtypes，然后在例如Android用户被给予系统对话与应用程序，可以提供他的文件input接受MIME的内容，什么是伟大的，因为在移动设备上的文件浏览器中的文件浏览是缓慢的，经常压力。
一个重要的事情是，一些移动浏览器（基于Android版本的Chrome 36和Chrome Beta 37）不支持通过扩展和多种MIMEtypes进行应用程序过滤。
