我正在使用 jQuery 文件上传库（http://github.com/blueimp/jQuery-File-Upload http://github.com/blueimp/jQuery-File-Upload），并且我一直在思考如何使用满足以下条件的库。
- 该页面有多个由表单标签包围的文件输入字段。
- 用户可以将多个文件附加到每个输入字段
- 单击按钮时，所有文件都会发送到服务器，而不是将文件附加到输入字段时。
- 上传是异步完成的
- 假设页面有 3 个输入字段，其名称属性为“file1[]”、“file2[]”和“file3[]”，请求负载应类似于 {file1: [ file1[] 上的文件数组], file2 : [ file2[] 上的文件数组], ...}
这是 jsFiddle，到目前为止它的行为很奇怪，它发送了两次 post 请求，而第一个请求被取消了。
Updates
现在感谢@CBroe的评论，请求发送两次的问题已经解决。但是请求参数的键设置不正确。
这是更新的 jsFiddle。
http://jsfiddle.net/BAQtG/27/ 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} )
})
})
有人知道如何让它发挥作用吗？
Solved.
Fiddle:
http://jsfiddle.net/BAQtG/29/ 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});
})
})
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
