JQuery -获取输入内部的所有文件=‘fileNames’

Question

我有<input type="file" id="basicUploadFile" multiple="multiple">，我想要得到这个输入中的所有文件名。我看过一些例子，但它只得到了第一个文件的名称。

$ ('#basicUploadFile').live ('change', function () {
    alert($ ('#basicUploadFile').val());
});

我该怎么做呢？谢谢。

Answer 1

var files = $('#basicUploadFile').prop("files")

files将是一个FileList对象。

var names = $.map(files, function(val) { return val.name; });

现在names是一个字符串数组(文件名)

FileAPI reference

files property reference

Answer 2

jsFiddle Demo

您仍然可以在不过度使用jQuery的情况下将文件作为FileList集合进行访问。我已经创建了一个快速的jsFiddle，演示了如何使用FileList和File对象从输入中获取信息。下面是一个代码片段：

$('#basicUploadFile').live('change', function ()
{
    for (var i = 0; i < this.files.length; i++)
    {
        alert(this.files[i].name);
        alert(this.files.item(i).name); // alternatively
    }
});

Answer 3

我使用此命令在控制台中显示所有文件名：

var input_file = $("#input_file");
input_file.on("change", function () {
     var files = input_file.prop("files")
     var names = $.map(files, function (val) { return val.name; });
     $.each(names, function (i, name) {
          console.log(name);
     });
});