我有一个文件上传对象在我的页面上:

<input type="file" ID="fileSelect" />

在我的桌面上有以下excel文件:

file1.xlsx file1.xls file.csv

我想上传的文件只显示.xlsx, .xls, & .csv文件。

使用accept属性,我发现这些内容类型负责.xlsx和.xls扩展…

接受应用程序/ vnd.openxmlformats-officedocument.spreadsheetml =。表(.XLSX) 接受=应用程序/盾。ms excel (xls)

但是,我找不到Excel CSV文件的正确内容类型!有什么建议吗?

例如:http://jsfiddle.net/LzLcZ/


当前回答

现在你可以使用新的html5输入验证属性pattern=".+\.(xlsx|xls|csv)"。

其他回答

除了最上面的答案之外,例如,CSV文件在macOS下报告为文本/纯文本,但报告为应用程序/vnd。ms-excel。 所以我用这个:

<input type="file" accept="text/plain, .csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />

在Safari 10下,这对我来说行不通:

<input type="file" accept=".csv" />

我不得不这样写:

<input type="file" accept="text/csv" />

只写你想要接受的扩展,在动作atr中以逗号分隔

<input type="file" accept=".any, .ext, .you, .want">

你可以知道任何文件的正确内容类型,只需执行以下操作:

1)选择感兴趣的文件,

2)在控制台运行:

console.log($('.file-input')[0].files[0].type);

你也可以为你的输入设置属性“multiple”,一次检查几个文件的内容类型,然后执行下面的操作:

for (var i = 0; i < $('.file-input')[0].files.length; i++){
    console.log($('.file-input')[0].files[i].type);
}

Attribute accept对于多个属性有一些问题,在这种情况下不能正确工作。

现在你可以使用新的html5输入验证属性pattern=".+\.(xlsx|xls|csv)"。