如何使用FormData在一个键下附加多个值

Question

如下:我试图找到一种方法如何使用FormData

在相同的键下附加输入值

结果:

sku: [saafasf, hjhkk]
quantity: [3, 3]

<div>
 <input value="saafasf" readonly="" id="sku" name="sku"> 
 <input value="3" readonly="" id="quantity" name="quantity">
 <input value="hjhkk" readonly="" id="sku" name="sku"> 
 <input value="3" readonly="" id="quantity" name="quantity">
</div>

试图找到一种方法如何通过FromData在一个键下获得多个值的数组结果

Answer 1

同一DOM中的多个HTML元素不能包含相同的id。因此，您必须将它们转换为类才能使其工作。

然后您可以使用document.querySelectorAll()方法访问同一类下的输入值。

Live Demo :

const skuArr = Array.from(document.querySelectorAll(".sku"), ({ value }) => value);
const quantityArr = Array.from(document.querySelectorAll(".quantity"), ({ value }) => value);
const formDataObj = {
  sku: skuArr,
  quantity: quantityArr
};
console.log(formDataObj);

<div>
 <input value="saafasf" readonly="" class="sku" name="sku"> 
 <input value="3" readonly="" class="quantity" name="quantity">
 <input value="hjhkk" readonly="" class="sku" name="sku"> 
 <input value="3" readonly="" class="quantity" name="quantity">
</div>