Question

我有以下html：

<tr class="row">
    <td>row 1</td>
    <td><input type="text" class="user-input"></td>
    <td><input type="text" class="user-input"></td>
</tr>

<tr class="row">
    <td>row 2</td>
    <td><input type="text" class="user-input"></td>
    <td><input type="text" class="user-input"></td>
</tr>

假设表单得到以下输入

row1 | a | B'/ P>

row2 | c | d

我想从表中获得以下对象：

[{a,b}, {c,d}]

我尝试使用.each来获取值

$(".row .user-input").each( function() {
    ...
});

但是我只能通过使用上面的行获得[a，b，c，d]。我想知道是否有一种方法可以使用类似嵌套的方法来实现此目的。

感谢您的帮助！

Answer 1

我认为你需要的是一个数组数组，然后你可以迭代每一行然后遍历该行中的每个输入，如

var values = $('.row').map(function() {
  return [$(this).find('.user-input').map(function() {
    return $(this).val();
  }).get()];
}).get();

$('pre').html(JSON.stringify(values));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr class="row">
    <td>row 1</td>
    <td>
      <input type="text" class="user-input" value="a">
    </td>
    <td>
      <input type="text" class="user-input" value="b">
    </td>
  </tr>

  <tr class="row">
    <td>row 2</td>
    <td>
      <input type="text" class="user-input" value="c">
    </td>
    <td>
      <input type="text" class="user-input" value="d">
    </td>
  </tr>
</table>

<pre></pre>

Answer 2

  arr = [];
  $('.row').each(function(o) {
    var inner = [];
    $('.user-input', this).each(function(e) {
      inner.push($(this).val());
    });
    arr.push(inner);
  });

-

<table>
  <tr class="row">
   <td>row 1</td>
   <td>
     <input type="text" class="user-input" value="a">
   </td>
   <td>
     <input type="text" class="user-input" value="b">
   </td>
 </tr>

 <tr class="row">
   <td>row 2</td>
   <td>
     <input type="text" class="user-input" value="c">
   </td>
   <td>
    <input type="text" class="user-input" value="d">
   </td>
 </tr>

</table>

请点击此处：http://codepen.io/anon/pen/OyYdpq

JQuery在类中获取类值

2 个答案: