Question

我正在使用HTML 5多个文件来选择多个文件进行上传。这些文件是$_FILES变量中的文件数组。我想使用jQuery来获取单击上传按钮之前列出的文件的所有名称。

<input class="pictures-upload" name="multiplePhotos[]" type="file" multiple="multiple" />

我想附加一个onchange事件，当一个人点击上传文件并选择多个文件时，它将获取所有文件的名称并将其附加到html的主体上。我正在使用

$('.upload_button').live('change', function () {
     var li = $('<li />').text($(this).val()),
     $('#body').append(li);

 });

这只需要选择最后一个文件。我如何获得所有文件？

Answer 1

input元素具有'files'的本机属性，它是FileList类型（即File的序列）。如果您查看File元素的W3规范，您将发现可以访问的属性。

然而，长话短说，jQuery val方法不会返回你想要的东西。由于'files'是input元素的native属性，因此您可以使用this.files直接访问它。然后迭代数组以获取您可以获取的文件对象（名称，大小，类型等）。

for (var i = 0; i < this.files.length; i++) {
    var file = this.files[i];
    $fileList.append('<li>' + file.name + '</li>');
}