我有一个文件上传对象在我的页面上:
<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/
当前回答
你可以知道任何文件的正确内容类型，只需执行以下操作:
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对于多个属性有一些问题，在这种情况下不能正确工作。
其他回答
你可以知道任何文件的正确内容类型，只需执行以下操作:
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对于多个属性有一些问题，在这种情况下不能正确工作。
在Safari 10下，这对我来说行不通:
<input type="file" accept=".csv" />
我不得不这样写:
<input type="file" accept="text/csv" />
您可以使用以下接受类型
<input id="upload_file" accept="image/png,image/jpg,image/jpeg，.doc， .docx，.xls，.xlsx，.pdf，.csv，" name="upload_file" type="file"/> .
我修改了@yogi的解决方案。另外，当文件格式不正确时，我重置输入元素值。
function checkFile(sender, validExts) {
var fileExt = sender.value;
fileExt = fileExt.substring(fileExt.lastIndexOf('.'));
if (validExts.indexOf(fileExt) < 0 && fileExt != "") {
alert("Invalid file selected, valid files are of " +
validExts.toString() + " types.");
$(sender).val("");
return false;
}
else return true;
}
我有自定义验证内置，因为在打开的文件窗口中，用户仍然可以选择选项“所有文件('*')”，无论我是否显式地设置输入元素中的接受属性。
现在你可以使用新的html5输入验证属性pattern=".+\.(xlsx|xls|csv)"。
