Question

我正在尝试检测重复项，使用户能够通过从我推送的阵列中删除文件来从上传窗口中删除文件。现在我无法上传最终文件列表。我不认为我的数组有实际的文件数据。

以下是我构建文件数组的方法：

var masterList = [];

function drop(evt) {
   evt.stopPropagation()
   evt.preventDefault();
   var fileList = evt.dataTransfer.files; //Getting the file(s)
   buildList(fileList); //Passing the file(s)
}

function buildList(fileList) {
   //Detect duplicates by comparing incoming filenames and current list
   var currentNames = _.pluck(masterList, 'name');
   $.each(fileList, function(i, file) {
      if ($.inArray(file.name, currentNames) == -1) {
         masterList.push(file);
         //is this pushing the file or have I lost the file handle              } else {}
   });
  }

查看masterList中的对象时，显示：

File { name: "Logo.pdf", 
     lastModified: 1429803494000, 
     lastModifiedDate: Date 2015-04-23T15:38:14.000Z, 
     size: 1511129,
     type: "application/pdf"
   }

这是上传功能。上传窗口中的每个文件都有自己的进度条。：

function startUpload() {
     if (masterList.length > 0) {
        var finished = 0;
        $.each(masterList, function(i, file) {
              console.log(file); //Output above
              var data = new FormData();
              data.append('file', file); //<- This is not allowed
              //Start Upload
              $.ajax({
                    xhr: function() {
                       var xhr = new window.XMLHttpRequest();
                       //Upload progress
                       xhr.upload.addEventListener("progress", function(evt) {
                          if (evt.lengthComputable) {
                             var percentComplete = evt.loaded / evt.total;
                             console.log(percentComplete);
                          }
                       }, false);
                       return xhr;
                    },
                    type: 'POST',
                    url: 'uploader.php',
                    data: data,
                    success: function(data) {
                       //Do something successful
                    }
                 }
              });

        });
     }
  }

目前我无法将文件存入我创建的FormData中，也不确定这是将最终组发送到服务器的最佳方式。

Answer 1

我想将FormData用于jQuery的XHR，你必须告诉它不要处理数据，.i.e：

$.ajax({
  data: formData,
  processData: false,
  contentType: false
  ...
});

文件API，上传文件数组

1 个答案: