Jasny 与其他表单元素一起上传多个文件答案

【问题标题】：Jasny multiple file upload with other form elementsJasny 与其他表单元素一起上传多个文件
【发布时间】：2014-01-14 23:23:06
【问题描述】：

我尝试使用 Jasny fileupload 将多个文件传递给表单内的 php，在提交事件时应通过 ajax 发布的数据上传。但我无法让它工作。我无法将 jasny 上传附加到发布的数据中。

如果有更好的解决方法，我想知道什么会更好，而不是 jasny。

我按如下方式初始化我的上传字段

jQuery('.fileupload').fileupload({});

我尝试在提交时捕捉主题

wizard.on("submit", function(wizard) {
    jQuery.ajax({
      //here When I serialize the form I do not get the files
    });
});

【问题讨论】：

如果您设置一个 jsfiddle 或类似的显示更多代码会很有帮助。
对不起，我会尝试刷新这个问题。当时我选择了另一种解决方法
您的表单看起来如何？你有正确的enctype吗？

标签： javascript php jquery twitter-bootstrap file-upload

【解决方案1】：

我们走吧
首先，您需要将倍数放在输入文件中 2sd
您将需要使用画布并在脚本中的循环中一一发送
看看https://plugins.jquery.com/tag/canvas/
http://canvasquery.com/

【讨论】：

【解决方案2】：

请查看 jQuery File Upload (https://github.com/blueimp/jQuery-File-Upload)，它支持多个文件上传，并为 PHP 实现了后端。

【讨论】：

这是我当时正在使用的，似乎可以完成这项工作

【解决方案3】：

试试

var data = new FormData();
jQuery.each($('#file')[0].files, function(i, file) {
  data.append('file-'+i, file);
});

所以现在您有了一个 FormData 对象，可以与 XMLHttpRequest 一起发送。

$.ajax({
   url: 'php/upload.php',
   data: data,
   cache: false,
   contentType: false,
   processData: false,
   type: 'POST',
   success: function(data){
      alert(data);
   }
});

【讨论】：

在 Safari 5/Firefox 4 中，使用 FormData 类是最简单的：