blueimp jquery-fileupload异步上传多个文件

Question

我使用jQuery文件上传库(http://github.com/blueimp/jQuery-File-Upload),我一直停留搞清楚如何利用图书馆满足以下条件.

• 该页面具有由表单标记包围的多个文件输入字段.
• 用户可以将多个文件附加到每个输入字段
• 单击按钮时,所有文件都将发送到服务器,而不是在将文件附加到输入字段时.
• 上传是异步完成的
• 假设页面有3个输入字段,其名称属性为"file1 []","file2 []"和"file3 []",请求有效负载应该像{file1:[file1 []上的文件数组],file2 :[file2 []]上的文件数组,...}

这是jsFiddle,它到目前为止表现得很奇怪,因为它发送了两次post请求,第一个被取消了.

更新

现在感谢@CBroe的评论,请求发送两次的问题是固定的.但是,请求参数的键未正确设置.这是更新的jsFiddle.

http://jsfiddle.net/BAQtG/27/

---

js代码的核心部分看起来像这样.

$(document).ready(function(){
    var filesList = []
    var elem = $("form")
    file_upload = elem.fileupload({
        formData:{extra:1},
        autoUpload: false,
        fileInput: $("input:file"),
    }).on("fileuploadadd", function(e, data){
        filesList.push(data.files[0])
    });

    $("button").click(function(){
        file_upload.fileupload('send', {files:filesList} )
    })

})

任何人都知道如何让这个工作？

Answer 1

解决了.

小提琴:http: //jsfiddle.net/BAQtG/29/

和js代码

$(document).ready(function(){
    var filesList = [],
        paramNames = [],
        elem = $("form");
    file_upload = elem.fileupload({
        formData:{extra:1},
        autoUpload: false,
        fileInput: $("input:file"),
    }).on("fileuploadadd", function(e, data){
        filesList.push(data.files[0]);
        paramNames.push(e.delegatedEvent.target.name);
    });

    $("button").click(function(e){
        e.preventDefault();
        file_upload.fileupload('send', {files:filesList, paramName: paramNames});
    })
})