Javascript 试图通过AJAX发送输入文件数据，can'；我无法访问控制器中的数据

我使用的是Laravel3，我在用户评论中加入了AJAXing。我们正在给这个评论添加图像，我似乎无法获取文件数据。当我将processData设置为false时，我也无法访问其他数据，如评论和隐私。有什么见解吗

var commentforms = $('form.compose');
commentforms.on('submit', function(e){
  e.preventDefault();

  var file = document.getElementById('file_input').files[0];

  $.ajax({
    type: 'POST',
    url: '/issue/comment/' + issue_id,
    processData: false,
    data: {
      side: side,
      comment: comment,
      privacy: privacy,
      file: file,
    },
    success: function(response){
      console.log(response);
      new_comment = comment_template(response);
      updateSide(new_comment);
    },
});

---

根据Kevin B的评论，有几种方法可以做到这一点

首先，它不起作用的原因是，默认情况下，不能使用AJAX请求发送文件。就是这样，这就是它不起作用的原因。无论您对表单和AJAX请求做了什么，您都会陷入困境。（这里AJAX的意思是不是XMLHttpRequest2）

解决方案1

Kevin B推荐使用Javascript

formData

对象，它是XMLHttpRequest级别2的一部分。有关如何使用它的信息，请参见： 关于您的代码，您可以按照以下方式编写代码：

commentforms.on('submit', function(e){
  e.preventDefault();

  var oData = new FormData(document.forms.namedItem("composeForm"));

  var oReq = new XMLHttpRequest();
  oReq.open("POST", '/issue/comment/' + issue_id, true); 
  //on a side note, issue_id isn't declared anywhere...
  oReq.onload = function(oEvent) {
    if (oReq.status == 200) {
      console.log("Uploaded!");
    } else {
      console.log("Error " + oReq.status + " occurred uploading your file.");
    }
  };
  oReq.send(oData);
});

问题

正如Kevin B所说，它没有得到广泛支持。检查这里：您可以看到IE9和以下版本不受支持，即XP、Vista和未升级的Windows7。如果你的应用程序在你自己控制的网络上，并且你可以确保每个人都在使用Firefox/Chrome/IE10+，那么你就可以开始了。如果您要在公众中使用此功能，则需要另一种解决方案

其他解决方案

目前，许多网站使用AJAX上传文件，或者诱使您认为它是AJAX。其他网站做的是两件事之一：隐藏iFrame或Flash

隐藏的iFrame技巧是创建一个iFrame来填充当前表单的数据，然后像平常一样发送它，这意味着重新加载页面。因为它位于iFrame中并且是隐藏的，所以用户永远不会看到页面重新加载，内容也不会像您预期的那样上传

Flash的诀窍是使用一个小的Flash应用程序/插件来查找文件，然后将其发送到您的服务器。它相当容易使用，而且由于Flash受到广泛支持，它可以在大多数浏览器上实现这一点。你只需要包含插件，就可以了

插件

我更喜欢使用插件，因为它们为我做了所有艰苦的工作。我现在喜欢的一款，因为它的简单性是。它易于配置，看起来很棒，可以引导，也可以与jQuery一起使用。插件可以使用一种或两种方法来上传文件，甚至可以先尝试XMLHttpRequest2，然后再使用其他方法之一来上传文件。最终，大多数流行的插件都很容易配置，并提供了相当不错的文档，让它可以实现您想要的功能

其他流行插件：

阅读以下内容：

使用XHR2，支持通过AJAX上传文件。例如通过 对象，但遗憾的是，all/old不支持它 浏览器

试试这个：

var data= new FormData();
data.append( 'file', $('#file') );
$.ajax({
  url: 'file.php',
  data: data,
  processData: false,
  contentType: false,
  type: 'POST',
  success: function(response){
    console.log(response);
  }
});

并查看以下代码：

var data= new FormData();
data.append( 'file', $('#file') );
$.ajax({
  url: 'file.php',
  data: data,
  processData: false,
  contentType: false,
  type: 'POST',
  success: function(response){
    console.log(response);
  }
});

---

苏尔特

您必须创建一个formData对象并发送它。注意，IE的几个版本不支持formData。