Question

我正在寻找一个javascript / jquery（无论哪种方式）来收集我上传的所有文件。

我有以下代码，其中.afbeelding是几个文件输入字段的类

var geuploadeAfbeeldingen = $('.afbeeldingen').files;
  for (var i = 0; i < geuploadeAfbeeldingen.length; i++) {
}

这种方式似乎不起作用。当我尝试document.getElementsByClassName时，它也不起作用。然而有趣的是，document.getElementById似乎适用于一个输入字段

有什么想法吗？

Answer 1

这应该做你想要的事情

var files = [],
    geuploadeAfbeeldingen = $('.afbeeldingen').each(function(){
        for (var i = 0; i < this.files.length; i++){
            files.push(this.files[i]);
        }
    });

你最终得到一个数组（ files ），它保存你通过输入元素选择的每个文件。

演示 http://jsfiddle.net/gaby/GJW7Y/1/

如果您只想要文件名，请更改

files.push(this.files[i]);

与

files.push(this.files[i].name);

Answer 2

尝试这种方式：

var geuploadeAfbeeldingen = $('.afbeeldingen');
  for (var i = 0; i < geuploadeAfbeeldingen.length; i++) {
      alert(geuploadeAfbeeldingen[i].files[0].name);
}

这可能会对你有所帮助。

编辑：

$('.afbeeldingen').files不起作用，document.getElementById().files正常工作，因为第一个返回JQuery对象（对象数组），第二个返回DOM对象.jQuery对象（由$方法创建）是DOM元素或一组DOM元素的包装器。 JQuery对象不支持常规属性和方法。

Answer 3

您需要遍历每个输入元素并返回files属性。

这样的事情可能是最简短的方法，使用map迭代数组：

var geuploadeAfbeeldingen =  $('.afbeeldingen').map(function(k, v) { return v.files[0]; }).get();

获取所有.uploadedFiles的所有文件

3 个答案: