在 HTML 文件打开对话框中过滤文件答案

【问题标题】：Filter files in HTML file open dialog在 HTML 文件打开对话框中过滤文件
【发布时间】：2011-10-02 05:55:51
【问题描述】：

我正在使用 HTML 标记将文件上传到服务器：

<input type="file">

当我单击浏览按钮时，它会显示一个文件打开对话框。我可以通过将扩展过滤器传递给该对话框来过滤文件吗？就像我们可以在 .Net 框架的文件打开对话框中做的那样，传递一些类似的东西：

Text files *.txt|.txt

使用此过滤器我们只能打开.txt 文件。未向用户显示的其他文件。这个对话框有什么选项吗？

【问题讨论】：

【解决方案1】：

标准

实际上，在 HTML5 中，您可以设置 accept 属性，所以现在这是可能的！ W3C standard 声明：

accept 属性可以指定为用户代理提示将接受哪些文件类型。

只需将有效的MIME type 传递给属性，例如：

<input type="file" accept="image/*">

【讨论】：

【解决方案2】：

我的问题是，我可以通过将扩展过滤器传递给该对话框来过滤文件吗？

不，你不能用普通的type="file" 输入来做到这一点。你可以使用一些Flash upload controls 虽然这可以让你实现这一点。

【讨论】：

【解决方案3】：

我认为您不能编辑此对话框选项，但您可以在用户选择文件后对其进行验证。

要编辑对话框，我记得您可以通过 flash 或 Silverlight 上传器（例如 swfUpload）来完成。

【讨论】：

【解决方案4】：

这是我在需要过滤某些文件类型时想出的一段代码：

<input type="file" accept=".xls, .xlsx, .csv" placeholder="File to be upload" />

Accept 属性支持多个文件以逗号分隔。

【讨论】：