如何合并两个 JavaScript FormData 对象

Question

我需要将两个FormData对象合并并使用XMLHttpRequest进行提交。其中一个表单包含文件输入。

var formData = new FormData(document.forms.namedItem('form-ship'));
var poData = new FormData(document.forms.namedItem('po-form'));

// Combine them
var fData = $.extend(true, formData, poData);

当我使用$.extend或者使用serialize()来合并没有文件输入的表单时，它不起作用。是否有任何想法如何解决这个问题？

- u54r

---

你能否将这两个设置为数组的成员，然后发布该数组？ - Rooster

我不明白，请您详细说明一下好吗？ - u54r

Answer 1

我这样做的：

我这样做的：

let formData = new FormData($("#f_articulos")[0]);
let formDataPrecios = new FormData($("#f_listado_precios")[0]);
for (var pair of formDataPrecios.entries()) {
    formData.append(pair[0], pair[1]);
}

- andreshg112

---

对于使用此功能的任何人来说，entries 的使用在 IE 和其他浏览器中支持不太好：https://caniuse.com/#search=entries - A Friend

Answer 2

您不能，改为过去式。 FormData 不可枚举。

不过，既然您说只有一个表单包含文件输入，则可以在其他表单上使用serializeArray，并手动将数据添加到append中：

var formData = new FormData(document.forms['form-ship']); // with the file input
var poData = jQuery(document.forms['po-form']).serializeArray();
for (var i=0; i<poData.length; i++)
    formData.append(poData[i].name, poData[i].value);

- Bergi

---

FormData.entries() - 返回一个迭代器，允许遍历此对象中包含的所有键/值对。 - Meglio

Answer 3

form_data_1 = 新 FormData(document.getElementById('form1')) form_data_2 = 新 FormData(document.getElementById('form2'))

  for (const pair of form_data_2.entries()) {
    form_data_1.append(pair[0], pair[1]);
  }



  for (const pair of form_data_1.entries()) {
    console.log(`${pair[0]}, ${pair[1]}`);
  }

- Mohammed Shabeer k