Question

我有一些HTML的结构或多或少都像我希望能够按行过滤。

<div class="parentElement">
   <div class="rowInput">
      <input type="checkbox" />
      <input type="text" value="demo" />
   </div>

   <div class="rowInput">
      <input type="checkbox" />
      <input type="text" value="demo" />
      <select> 
         <option>Value 1</option>
         <option>Value 2</option>
      </select>
   </div>
</div>

我能够通过

获得我需要的两行

var row = $('.rowInput');

0: div.row.inputRow
1: div.row.inputRow

然而，我遇到了解决这些行并进一步提取任何信息的问题。我已经尝试了几种不同的循环遍历行的方法，但是我能够做的最好的就是遍历元素的属性列表。但是，想要做的是遍历div.row.inputRow的每个元素，并根据元素类型提取信息，以便我可以按行存储信息。

编辑：我能够通过以下代码获得我想要的内容：

for (var i = 0; i < rows.length; i++) {
        console.log(rows[i]);
    for (var j = 0; j < rows[i].childNodes.length; j++) {
            console.log(rows[i].childNodes[j]);
    }
}

然而，每当我尝试使用jQuery＆＃39; .is（）＆＃39;时，我都会收到错误。在子节点上我回来了

Uncaught TypeError: rows[i].childNodes[j].is is not a function

基本上我最终要做的就是用＆＃39; .inputRow＆＃39;返回每个元素。所以我可以过滤掉每行的输入，然后根据选中的复选框存储或丢弃它。我走这条路的主要原因是我无法获得行所需的输入，同时选择＆＃39;选择＆＃39;和＆＃39;：输入＆＃39;选择器。

Answer 1

尝试each()功能：

$('.rowInput').each(function() {
   var $this = $(this);
   var checkbox = $this.find('input[type=checkbox]');
   var text = $this.find('input[type=text]');
});

$(this)指的是每个.rowInput元素。

Answer 2

您的代码是正确的，除了让孩子们尝试以下方法：

var rows = $('.rowInput');

for (var i = 0; i < rows.length; i++) {
  console.log(rows[i]);
  for (var j = 0; j < $(rows[i]).children().length; j++) {
    console.log( $(rows[i]).children()[j]);
  }
}

在此处查看：jsfiddle

迭代jQuery选择器返回的元素

2 个答案: