JavaScript 文件比较

Question

我有 4 个文件输入标签来上传文件，如下所示，

Left File : <input type="file" name="dataFile1" id="fileChooser1" />
Right File : <input type="file" name="dataFile2" id="fileChooser2" />
Config File : <input type="file" name="dataFile3" id="fileChooser3" />
<button type="button" id="execute" onclick="ValidateFile()">Click to Upload files</button>

现在，我想确保只上传不同的文件。

如何在不使用第三方插件的情况下使用 JS/JQ 做到这一点？

我用过

var FileName1 = document.getElementById('fileChooser1').value;
var FileName2 = document.getElementById('fileChooser2').value;

if(FileName1 == FileName2)
 {
   alert("Same files cannot be uploaded");
 }

但这仅检查正在上传的文件的名称，如果上传两个名称不同但内容相同的文件，则它们将被识别为不同的文件。

Answer 1

您应该能够使用 jQuery 从输入字段获取文件大小属性。请参阅How to check file input size with jQuery? .

如果您比较这些文件，您将需要额外检查是否上传了相同的文件。虽然不能保证。

根据您的具体情况，您可以获得此信息以及更多额外信息，如下所示:

//Check file data before execution
$('#execute').live('click', function() {
   console.log($("#fileChooser1")[0].files[0]);
   console.log($("#fileChooser2")[0].files[0]);
   console.log($("#fileChooser3")[0].files[0]);
});

检查控制台输出以查看大小、类型和上次修改日期。我认为可以合理地假设，如果所有这些都相同，那么您正在处理相同的文件(禁止 0 大小的文件)。

在 this fiddle 上进行测试