文件输入‘接受’属性-它有用吗？

Question

文件输入‘接受’属性-它有用吗？在html下实现文件上传相当简单，但我刚刚注意到有一个“接受”属性可以添加到<input type="file" ...>标签。这个属性作为限制文件上传到图像等的方法有用吗？使用它的最佳方法是什么？或者，是否有一种方法可以限制html文件输入标记的文件类型(最好是在文件对话框中)？

Answer 1

这个accept属性是非常有用的。仅显示当前允许的文件是浏览器的提示。input..虽然它通常可以被用户覆盖，但默认情况下它有助于缩小用户的结果范围，这样他们就可以准确地获得他们想要的内容，而不必筛选出100种不同的文件类型。

使用

注：这些示例是基于当前规范编写的，可能并不能在所有(或任何)浏览器中实际工作。规范也可能在将来发生变化，这可能会破坏这些示例。

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>

来自HTML规范(来源)

这个accept属性以向用户代理提供将接受哪些文件类型的提示。

如果指定，则该属性必须由一组逗号分隔的令牌，其中每一个都必须是ASCII大小写不敏感匹配下列之一：

弦audio/*

• 指示接受声音文件。

弦video/*

• 指示接受视频文件。

弦image/*

• 指示接受图像文件。

A 无参数的有效MIME类型

• 指示接受指定类型的文件。

一个字符串，其第一个字符是U+002E句号字符(.)

• 指示接受具有指定文件扩展名的文件。

Answer 2

属性中引入了Accept属性。RFC 1867，目的是为文件选择控件启用基于MIME类型的文件类型筛选。但截至2008年，大多数浏览器(如果不是全部)都没有使用这个属性。使用客户端脚本，您可以进行一种基于扩展的验证，以提交正确类型(扩展)的数据。

其他高级文件上传解决方案需要Flash电影，如SWFUpload或者像这样的Java小程序朱普拉德.