使用jquery ajax进行文件上传的数据方法设置

Question

所以这个问题源于对使用 ajax 时数据方法的功能缺乏很好的理解。我在这里查看了大多数关于 ajax 的其他问题，但这部分对我来说并不适用。

例如，我使用 ajax 将表单数据（包括多个文本字段和一个文件上传）发送到 php。然后服务器脚本将字段数据和文件 url 插入到 sql db 中，然后将所有这些值作为 json 编码数组返回。

我当前的 ajax 脚本如下所示，当它运行时，除了文件上传部分外，一切正常。该文件没有保存到服务器，当然也没有 url 回来。如果我改变：

data: data,

到

data: text,

文件上传工作，文件被保存，但是当 json 数组返回页面时，我得到一个显示数组数据的白屏（它不会返回表单数据来自的页面） .

这是为什么？ 什么是正确的数据方法来允许我的文件上传工作和数据返回到它发送的页面。

$("document").ready(function() {
$(".data-form").submit(function() {
        var data = new FormData();
$.each(files, function(key, value)
  { data.append(key, value);
});
    if (confirm("\t\t\tAre you ready to sumbmit this listing?\nYou can always edit the listing after going to the menu tab - edit listing."))       {
        $.ajax({
            type: "POST",
            dataType: "json",
            url: "add-list.php",
            data: data,
            processData: false,
            contentType: false,
            success: function(response) {
                      if (response.success) {
                          $("#modal1").modal('hide');
                        $("#add_frame").show();
                        $("#newbutt").show();
                        $(".atitle").html('<a href="' + response.ad_linka + '" target="_blank">' + response.titlea + '</a>');
                        $(".acomment").html(response.commenta);
                        $(".aaddress").html(response.addressa);
                        $(".asale-price").html(response.sale_pricea);
                        $(".alease-price").html(response.lease_pricea);
                        $(".alot-size").html(response.lot_sizea);
                        $(".abuilding-size").html(response.build_sizea);
                        $(".azoning").html(response.zoninga);
                        }
                      else {
                          console.log("An error has ocurred: sentence: " + response.sentence + "error: " + response.error);
                      }
                  },
                  error: function() {
                      alert("An Error has ocurred contacting the server. Please contact your system administrator");
                  }
              });
        return false;
    }
});
});

Answer 1

你需要告诉 jquery 停止处理你的数据

     processData: false, // Don't process the files
    contentType: false, // defaults to 'application/x-www-form-urlencoded; charset=UTF-8'

你没有发送你是如何构建数据的，但是这样的东西应该可以工作

    var data = new FormData();
    $.each(files, function(key, value)
      { data.append(key, value);
    });