如何让html5文件输入在不同浏览器之间一致地只接受某些文件类型？
根据this answer on Stack Overflow，我们可以设置<input type="file" />的accept属性来过滤接受的输入，如下所示：
accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"然而，正如你可以注意到运行下面的简单代码片段，Chrome43.0对来说，一些似乎完全忽略了的这种配置，而它完全被Firefox39.0理解。
我考虑换成更直截了当的方法，使用：
accept=".xls, .xlsx"..。这在Chrome上运行良好，但让火狐有点困惑，只接受使用.xlsx扩展名的文件。
考虑到这可能是非常常见和基本的，我肯定遗漏了一些东西:我在哪里搞砸了？如何让html5文件输入在浏览器之间一致地仅建议和文件？
这里有一段代码片段说明了我的问题(还有一个JSFiddle link，以防你想摆弄它)。
Accepts application/vnd.ms-excel and the likes:<br />
<label for="file1">File input</label>
<input type="file" name="file1" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"/>
<hr />
Accepts .xls and .xlsx:<br />
<label for="file2">File input</label>
<input type="file" name="file2" accept=".xls, .xlsx"/>
回答 4
Stack Overflow用户
发布于 2015-12-03 18:42:16
将它们同时传输mime类型和扩展名
<input type="file" name="file2" accept="text/csv, .csv"/>Stack Overflow用户
发布于 2015-12-04 02:05:08
免责声明： This is 无论如何都不是一个答案，而仅仅是给其他试图以错误方式使用此属性的潜在读者的一个说明。
在accept属性的this non-official W3C reference上，您可以找到以下内容：
提示:不要将此属性用作验证工具。文件上传应在服务器上进行验证。
不建议使用此属性进行验证，因为用户可以以某种方式解决它，并且并不是所有浏览器的行为都相同。
Stack Overflow用户
发布于 2015-11-30 19:55:41
第一:你确实有一个html5文档类型吗？
<!DOCTYPE html>因为如果你没有，它可能在某些地方不起作用。
第二:你可以使用javascript或jquery来代替html。查看此问题/答案：jquery - Check for file extension before uploading
第三:根据我的经验，有些html5的东西有时候是不起作用的。例如，我不知道为什么，但是有必要通过使用jquery来解决问题。
无论如何，您应该始终执行服务器端验证，以确保用户正在上传的内容实际上是您所限制的内容。
https://stackoverflow.com/questions/33882790
复制相似问题