Html 如何让 <input type="file"/> 只接受这些类型？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17293861/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to make <input type="file"/> accept only these types?
提问by Triet Doan
I want my uploader only allows these types:
我希望我的上传器只允许这些类型：
- doc, docx.
- xls, xlsx.
- ppt, pptx.
- txt.
- pdf.
- Image types.
- 文档，文档。
- xls，xlsx。
- ppt，ppt。
- 文本。
- pdf。
- 图像类型。
How can I achieve this? What should I put in the acceptattribute? Thanks for your help.
我怎样才能做到这一点？我应该在accept属性中输入什么？谢谢你的帮助。
EDIT!!!
编辑！！！
I have one more thing to ask. When the popup appears for use to choose file, at the down right corner, there is a drop down list contains all allow files. In my case, the list would be long. I see in the list, there is an option called All Supported Types. How can I make it chosen by default and eliminate all other options?
我还有一件事要问。当出现用于选择文件的弹出窗口时，在右下角，有一个包含所有允许文件的下拉列表。就我而言，列表会很长。我在列表中看到，有一个名为All Supported Types. 如何使其默认选择并消除所有其他选项？
Any help will be appreciated. Thank you.
任何帮助将不胜感激。谢谢你。
回答by Jukka K. Korpela
The value of the acceptattributeis, as per HTML5 LC, a comma-separated list of items, each of which is a specific media type like image/gif, or a notation like image/*that refers to all imagetypes, or a filename extension like .gif. IE 10+ and Chrome support all of these, whereas Firefox does not support the extensions. Thus, the safest way is to use media typesand notations like image/*, in this case
根据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/*">
if I understand the intents correctly. Beware that browsers might not recognize the media type names exactly as specified in the authoritative registry, so some testing is needed.
如果我正确理解意图。请注意，浏览器可能无法准确识别权威注册表中指定的媒体类型名称，因此需要进行一些测试。
回答by Ajith
Use Like below
使用如下
<input type="file" accept=".xlsx,.xls,image/*,.doc, .docx,.ppt, .pptx,.txt,.pdf" />
回答by Chamika Sandamal
Use accept attribute with the MIME_type as values
使用带有 MIME_type 的接受属性作为值
<input type="file" accept="image/gif, image/jpeg" />
回答by Epistomai
IMPORTANT UPDATE:
重要更新：
Due to use of only application/msword, application/vnd.ms-excel, application/vnd.ms-powerpoint... allows only till 2003 MS products, and not newest. I've found this:
由于只使用应用程序/msword、应用程序/vnd.ms-excel、应用程序/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
And that includes the new ones. For other files, you can retrieve the MIME TYPE in your file by this way (pardon the lang)(in MIME list types, there aren't this ones):
这包括新的。对于其他文件，您可以通过这种方式检索文件中的 MIME TYPE（请原谅 lang）（在 MIME 列表类型中，没有这种类型）：
You can select & copy the type of content
您可以选择和复制内容类型
回答by Amir Md Amiruzzaman
for powerpoint and pdf files:
对于 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>
回答by Wilker Iceri
audio/* - All sound files are accepted
video/* - All video files are accepted
image/* - All image files are accepted
MIME_type - A valid MIME type, with no parameters. Look at IANA MIME types for a complete list of standard MIME types
audio/* - 接受所有声音文件
video/* - 接受所有视频文件
image/* - 接受所有图像文件
MIME_type - 有效的 MIME 类型，没有参数。查看 IANA MIME 类型以获取标准 MIME 类型的完整列表
回答by Sagar Vaghela
for image write this
对于图像写这个
<input type=file accept="image/*">
For other, You can use the accept attribute on your form to suggest to the browser to restrict certain types. However, you'll want to re-validate in your server-side code to make sure. Never trust what the client sends you
对于其他，您可以使用表单上的 accept 属性来建议浏览器限制某些类型。但是，您需要在服务器端代码中重新验证以确保。永远不要相信客户发给你的东西
