JQuery1.8.0：通过AJAX从表单发送文件

Question

我使用CakePHP进行开发，最初以为这个问题与Cake有关。 不是。 我重新编写了问题，使我收到的答案更广泛地适用

我有一个表格

  <form action"">
      <fieldset> 
      <!---- bunch of fields----->
      <input type="file" name="data[Upload][file]" id="UploadFile">
      <button id="ajaxUploadSubmit"> Submit </button>
      </fieldset>
  </form>

我编写的submit函数如下所示：

$( "#ajaxUploadSubmit" ).click(function() {
                $.ajax({
                    url:"uploads/add",
                    data: $( "#UploadsAddForm" ).serialize()
                }).done(function(responseText) {
                    alert(responseText);
                  })
                 .fail(function() {
                     alert('failxors');
                  })
                });

但是这一行返回一个空数组： $this->request->data 。

Answer 1

我认为您不会停止提交表单：

$( "#ajaxUploadSubmit" ).click(function(e) {
      e.preventDefault();

而不是click尝试submit ：

尝试更改此：

$( "#ajaxUploadSubmit" ).click(function() {

对此：

$(".form").submit(function(e) {
    e.preventDefault();

Answer 2

我只是添加这个答案，所以这个问题可以标记为已回答； 实际上thaJeztah在Jai的答案的第3条评论中回答了这个问题：在这种情况下，问题是我应该一直使用FormData（）而不是Serialize（），如此处所示： 如何使用jquery序列化进行文件上传