<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>
8 回答
accept属性非常有用 . 这是浏览器只显示当前input允许的文件的提示 . 虽然它通常可以被用户覆盖，但它有助于缩小默认情况下用户的结果范围，因此他们可以获得他们正在寻找的内容，而无需筛选出一百种不同的文件类型 .用法
Note: 这些示例是基于当前规范编写的，可能并不适用于所有（或任何）浏览器 . 规范也可能在未来发生变化，这可能会打破这些例子 .
来自HTML规范（来源）
如果浏览器使用此属性，它只是作为用户的帮助，所以他不会上传一个多兆字节文件只是为了看到服务器拒绝它...
对于
<input type="hidden" name="MAX_FILE_SIZE" value="100000">标记也是如此：如果浏览器使用它，它将不会发送文件但是错误导致PHP中出现UPLOAD_ERR_FORM_SIZE（2）错误（不确定如何在其他语言中处理它） .请注意，这些对用户有帮助 . 当然，服务器必须始终检查文件的类型和大小：在客户端很容易篡改这些值 .
在2015年 the only way 我发现它适用于 Chrome 和 Firefox 是要放置您想要支持的所有可能的扩展，包括变体：
Problem with FireFox ：使用
image/jpegmime类型FireFox只显示.jpg文件，非常奇怪，好像常见的.jpeg不行......无论你做什么，一定要尝试使用具有许多不同扩展名的文件 . 也许它甚至取决于操作系统......
我认为
accept不区分大小写，但可能不是在每个浏览器中 .这是MDN docs about accept：
已经有几年了，Chrome至少使用了这个属性 . 从可用性的角度来看，此属性非常有用，因为它会过滤掉用户不必要的文件，使他们的体验更加顺畅 . 但是，用户仍然可以从类型中选择“所有文件”（或以其他方式绕过过滤器），因此您应该始终验证文件实际使用的位置;如果您在服务器上使用它，请在使用之前对其进行验证 . 用户始终可以绕过任何客户端脚本 .
Accept属性是在RFC 1867中引入的，旨在为文件选择控件启用基于MIME类型的文件类型过滤 . 但截至2008年，大多数（如果不是全部）浏览器都不使用此属性 . 使用客户端脚本，您可以进行一种基于扩展的验证，以提交正确类型（扩展名）的数据 .
其他高级文件上传解决方案需要像SWFUpload这样的Flash电影或像JUpload这样的Java Applet .
早在2008年，这并不重要，因为缺乏移动操作系统，但现在非常重要 .
当您设置接受的mime类型时，例如Android用户被给予系统对话框，其中的应用程序可以为他提供文件输入接受的mime内容，这很棒，因为在移动设备上浏览文件浏览器中的文件很慢并且经常有压力 .
一个重要的事情是，某些移动浏览器（基于Android版Chrome 36和Chrome Beta 37）不支持通过扩展程序和多种mime类型进行应用程序筛选 .
是的，它在支持它的浏览器中非常有用，但“限制”是为了方便用户（所以它们不是被不相关的文件淹没）而不是阻止他们上传您不希望他们上传的内容的方法 .
它受到支持
Chrome 16
Safari 6
Firefox 9
IE 10
歌剧11
这是a list of content types你可以使用它，然后是相应的文件扩展名（当然你可以使用任何文件扩展名）：
它受Chrome支持 . 它不应该用于验证，而是用于暗示操作系统的类型 . 如果文件上载中有
accept="image/jpeg"属性，则操作系统只能显示建议类型的文件 .