与 div 相关的输入的唯一值

Question

我有一个表单，其中某个部分有一个为每一行创建的输入表，如下所示。<input type="text" class="input1" name="fname" /><input type="text" class="input2" name="fname" /><input type="text" class="input3" name="fname" /><input type="text" class="input5" name="fname" />这些是动态创建的，用户控制行数，因此可以有 5 行，也可以有 20 行。我需要将输入的值获取到数组中，我通过循环包含<tr>输入的数组来创建数组。for (i = 0; i < $(".TRTR").length; i++) {  // trying to capture the values here });然后我将其推入数组中。arr.push(values)就目前情况而言，我没有得到正确的值。我想获取每个单独行的所有值，但我要么获取每个循环上的第一个输入值（通过使用该方法.val()），要么获取整个表中每个输入的所有值。我需要做的是获取该行的输入值，然后创建一个新对象，并在继续循环时在该对象上使用该行的值。因此，如果我有 4 行，数组中就会有 4 个对象，每个对象都有与该行相关的输入值。例子：object 1 { value 1, value 2, value 3, value 4 }object 2 { value 5, value 6, value 7, value 8 }任何帮助将不胜感激。

Answer 1

您可以使用它map()在每个表行中构建输入值的二维数组。尝试这个：

let values = $('tr').map((_, tr) => [$(tr).find(':input').map((_, input) => input.value).get()]).get();

console.log(values);

/* longer version of the above, although more readable:

let values = $('tr').map((_, tr) => {

  return [$(tr).find(':input').map((_, input) => input.value).get()

]).get();

*/

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>

  <tr>

    <td>

      <input type="text" class="input1" name="fname" value="1_1">

      <input type="text" class="input2" name="fname" value="1_2">

      <input type="text" class="input3" name="fname" value="1_3">

      <input type="text" class="input5" name="fname" value="1_4">

    </td>

  </tr>

  <tr>

    <td>

      <input type="text" class="input1" name="fname" value="2_1">

      <input type="text" class="input2" name="fname" value="2_2">

      <input type="text" class="input3" name="fname" value="2_3">

      <input type="text" class="input5" name="fname" value="2_4">

    </td>

  </tr>

</table>