98

我希望我的上传器只允许这些类型：

  • 博士，博士。
  • xls，xlsx。
  • ppt，pptx。
  • 文本。
  • .pdf
  • 图像类型。

我怎样才能做到这一点？我应该在accept属性中添加什么？谢谢你的帮助。

编辑！！！

我还有一件事要问。当弹出用于选择文件的弹出窗口时，在右下角，有一个包含所有允许文件的下拉列表。就我而言，列表会很长。我在列表中看到，有一个名为All Supported Types. 如何使其默认选择并消除所有其他选项？

任何帮助将不胜感激。谢谢你。

4

7 回答 7

158

根据HTML5 LC，该accept属性的值是一个以逗号分隔的项目列表，其中每个项目都是一个特定的媒体类型，如image/gif，或表示image/*所有image类型的符号，或文件扩展名，如.gif. IE 10+ 和 Chrome 支持所有这些，而 Firefox 不支持这些扩展。因此，在这种情况下，最安全的方法是使用媒体类型和符号，例如image/*

<input type="file" name="foo" accept=
"application/msword, application/vnd.ms-excel, application/vnd.ms-powerpoint,
text/plain, application/pdf, image/*">

如果我正确理解意图。请注意，浏览器可能无法准确识别权威注册表中指定的媒体类型名称，因此需要进行一些测试。

于 2014-06-22T04:49:32.043 回答
110

使用如下

<input type="file" accept=".xlsx,.xls,image/*,.doc, .docx,.ppt, .pptx,.txt,.pdf" />
于 2015-10-01T09:41:47.103 回答
12

使用带有 MIME_type 的接受属性作为值

<input type="file" accept="image/gif, image/jpeg" />
于 2013-06-25T09:40:25.590 回答
12

重要更新：

由于仅使用 application/msword、application/vnd.ms-excel、application/vnd.ms-powerpoint... 仅允许 2003 年之前的 MS 产品，而不是最新的。我发现了这个：

application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/vnd.ms-powerpoint, application/vnd.openxmlformats-officedocument.presentationml.slideshow, application/vnd.openxmlformats-officedocument.presentationml.presentation

这包括新的。对于其他文件，您可以通过这种方式检索文件中的 MIME TYPE（请原谅 lang）（在 MIME 列表类型中，没有这个）：

在此处输入图像描述

您可以选择和复制内容类型

于 2017-11-01T00:17:55.710 回答
8

对于 powerpoint 和 pdf 文件：

<html>
<input type="file" placeholder="Do you have a .ppt?" name="pptfile" id="pptfile" accept="application/pdf,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.slideshow,application/vnd.openxmlformats-officedocument.presentationml.presentation"/>
</html>
于 2014-01-10T20:24:00.907 回答
4

如w3schools 所述：

audio/* - 接受所有声音文件

video/* - 接受所有视频文件

image/* - 接受所有图像文件

MIME_type - 一个有效的 MIME 类型，没有参数。查看 IANA MIME 类型以获取标准 MIME 类型的完整列表

于 2013-06-25T09:38:29.003 回答
-1

对于图像写这个

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

对于其他，您可以使用表单上的接受属性向浏览器建议限制某些类型。但是，您需要在服务器端代码中重新验证以确保。永远不要相信客户发给你的东西

于 2013-06-25T09:43:58.283 回答