Question

我遇到了Ajax请求服务器的问题，我想获取所有表单数据并将其提交给服务器。问题是当我使用new FormData(form)返回一个空对象时。我在之前的项目之前完成了这项工作，并且效果很好。但是为什么这次不工作呢？我知道.serializeArray，但由于某些原因，我不想使用它。原因是我想添加一些文件并将其推送到服务器。

jquery-version: 3.4.0

表格：

<form id="myForm">
    <input type="email" name="username"/>
    <input type="password" name="password"/>

    <button type="button" id="btn">Submit</button>
</form>

脚本：

$(document).ready(function () {
     $('#btn').on('click', function () {
         let formData = new FormData($('#myForm')[0]);
         console.log(formData);
     });
})

Answer 1

您的for数据对象中有条目，但是您正在控制台中打印formdata对象。尝试按照以下步骤打印条目。

您需要迭代要打印的表单数据条目循环。

$(document).ready(function () {
  $('#btn').on('click', function () {
    let formData = new FormData($('#myForm')[0]);
    for(var item of formData.entries()) {
      console.log(item[0]+ ', '+ item[1]); 
    }
  });
})

因此，如果您找到条目。因此，您需要对其进行序列化以将其传递给ajax。或者您可以按条目创建对象并使用JSON.stringify(data)

传递它

var formObject = {};
formData.forEach(function(value, key){
    formObject [key] = value;
});

//在AJAX中

data: JSON.stringify(formObject);

您可以使用“ POST”或您的特定方法进入服务器

新的FormData返回空对象

1 个答案: