使用Summernote文件一次将多个文件上载到服务器



请问,我可以对下面的代码进行哪些更改,以便我的upload.php文件可以接收多个文件,我会让它们循环处理这些文件?我一直在尝试使用Summernote将多个文件同时上传到服务器。尽管我从笔记本电脑中选择了多个文件进行上传,但只有一个文件被上传。我确信处理上传的PHP文件不是问题,因为即使我选择了多个文件进行上传,它也只接收一个文件。下面是JQuery代码看起来像的样子

$('.summernote-mini').summernote({
height: 200,
tabsize: 2,
callbacks: {
onFileUpload: function(files) {
callBack(files[0]);
},
}
});

回调函数

function callBack(files) {

let data = new FormData();
data.append('media_upload[]', files);
$.ajax({
data: data,
type: "POST",
url: "upload.php",
cache: false,
contentType: false,
processData: false,
xhr: function() { //Handle progress upload
let myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) myXhr.upload.addEventListener('progress', progressHandlingFunction, false);
return myXhr;
}

}).done(function(reponse){

//I handle the response here

});
}

无论我选择上传的文件数量如何,count($_FILES['media_upload']['name'])都会在我的例如upload.php文件中为我提供1,用于处理服务器端文件上传。这个问题的解决办法是什么?

在得到@Fravadona的帮助后,我找到了问题的解决方案。我按照@Fravadona的建议用callBack(files);替换了callBack(files[0]);

然后,在回调函数中,我用以下代码替换了data.append('media_upload[]', files);

var iLength = files.length;
var i;
for(i = 0; i < iLength; i++){
data.append("media_upload[]", files[i]);
}

因此,正确的代码变成了:

$('.summernote-mini').summernote({
height: 200,
tabsize: 2,
callbacks: {
onFileUpload: function(files) {
callBack(files);
},
}
});

回调功能变成了这样:

function callBack(files) {
let data = new FormData();
var iLength = files.length;
var i;
for(i = 0; i < iLength; i++){
data.append("media_upload[]", files[i]);
}
$.ajax({
data: data,
type: "POST",
url: "upload.php",
cache: false,
contentType: false,
processData: false,
xhr: function() { //Handle progress upload
let myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) myXhr.upload.addEventListener('progress', progressHandlingFunction, false);
return myXhr;
}

}).done(function(reponse){

//I handle the response here

});
}

所以现在,我可以使用Summmernote一次成功上传多个文件了。

最新更新