javascript - 为什么我的 ajax multipart/form-data POST 请求的正文为空？

Question

我的 html 中有以下表单:

<form id="formid" action="upload" method="POST" enctype="multipart/form-data">
<input type="file" name="file">
</form>

我通过ajax提交POST请求，如下:

function upload_ajax(){
  var xhr = new XMLHttpRequest();

  var form = $("#formid");
  var formData = new FormData(form);

  xhr.open("post", form.attr('action') , true);
  xhr.send(formData);
}

但是当我选择一个文件并运行 upload_ajax() 时，该文件不会发送到服务器。在检查 POST 请求时，我可以看到正文是空的(边界除外:-----WebKitFormBoundaryzRrtLc7ACnj5mKtE--)。

如果我用下面的 upload_normal() 替换 upload_ajax() ，一切都会正常工作:

function upload_normal(){
   $('#formid').submit();
} 

任何人都可以帮助我理解我在 ajax 调用中做错了什么吗？

Answer 1

我认为你的错误是 $("#formid") 是 jquery 对象而不是表单。

要访问表单，请写入:

var form = $("#formid")[0];