javascript - 获取将在动态生成的输入中键入的值的最佳方法是什么

Question

我有一个可以动态创建输入的表单。

它的一个例子是这样的:

<form>
    <input name="item[0][name]">
    <input name="item[1][name]">
</form>

0 和 1 是项目的 ID。

请注意，0 和 1 可能是 15 和 49，甚至 520、854 和 2。

没有顺序也没有排序，也没有限制只能是两个项目。

问题是:

“在将这些输入发送到后端之前，获取将在这些输入中键入的值的最佳方法是什么？”

我能想到的唯一方法是在生成表单时添加id，但这看起来一点也不优雅。

如果你想不出更好的方法，那就太好了 =)

Answer 1

您可以使用 document.querySelectorAll() 和属性选择器

function submit() {
  let inputs = document.querySelectorAll('input[name*=item]');
  let values = Array.from(inputs).map(({value})=>value);
  console.log(values);
}

<form>
    <input name="item[0][name]">
    <input name="item[1][name]">
</form>

<button onclick="submit()">Sumbit</button>