如何在jquery中找到具有特定類名的行？

Question

我有一張桌子，上面列出了數百個項目，如下所示。

<tr class="available" id="trline01"><td>1</td>
<td><input type="text" class="ordItem" id="oline01" value="100"           
readonly="readonly" /></td><</tr>
<tr class="available" id="trline02"><td>2</td>
<td><input type="text" class="ordItem" id="oline02" value="20"    
readonly="readonly" /></td><</tr>
<tr class="outofstock" id="trline03"><td>3</td>
<td><input type="text" class="ordItem" id="oline03" value="0"  
readonly="readonly" /></td><</tr>
<tr class="available" id="trline04"><td>4</td>
<td><input type="text" class="ordItem" id="oline04" value="20"  
readonly="readonly" /></td><</tr>
<tr class="discount" id="trline05"><td>5</td>
<td><input type="text" class="ordItem" id="oline05" value="10"  
readonly="readonly" /></td><</tr>

....

我正在嘗試通過以下每個語句跳過“缺貨”行

$.each($('.ordItem'), function() {
    if ( !$(this).hasClass(outofstock)) {
        data[$(this).data('code')] = $(this).val();
    }
});

如何tr行並跳過該行？

Answer 1

因此，選擇可用的行，然后選擇輸入。

$('tr.available .ordItem').each()

 $('tr.available .ordItem').each( function(){ console.log(this.id) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr class="available" id="trline01"><td>1</td> <td><input type="text" class="ordItem" id="oline01" value="100" readonly="readonly" /></td></tr> <tr class="available" id="trline02"><td>2</td> <td><input type="text" class="ordItem" id="oline02" value="20" readonly="readonly" /></td></tr> <tr class="outofstock" id="trline03"><td>3</td> <td><input type="text" class="ordItem" id="oline03" value="0" readonly="readonly" /></td></tr> <tr class="available" id="trline04"><td>4</td> <td><input type="text" class="ordItem" id="oline04" value="20" readonly="readonly" /></td></tr> </table> 

並且由於您沒有事先提供所有詳細信息，因此可以使用not（）刪除缺貨的行

 $('tr:not(.outofstock) .ordItem').each( function(){ console.log(this.id) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table> <tr class="available" id="trline01"><td>1</td> <td><input type="text" class="ordItem" id="oline01" value="100" readonly="readonly" /></td></tr> <tr class="available" id="trline02"><td>2</td> <td><input type="text" class="ordItem" id="oline02" value="20" readonly="readonly" /></td></tr> <tr class="outofstock" id="trline03"><td>3</td> <td><input type="text" class="ordItem" id="oline03" value="0" readonly="readonly" /></td></tr> <tr class="available" id="trline04"><td>4</td> <td><input type="text" class="ordItem" id="oline04" value="20" readonly="readonly" /></td></tr> </table> 

Answer 2

$.each($('.available .ordItem'), function(index, item) {
    console.log(item);
})

這將管理所有類為“ .ordItem”的輸入，這些輸入是類為“ .avaliable”的行的子級

Answer 3

您可以使用以下代碼檢索分配了任何類的任何元素。

$（“你的類名”）

並在需要時將其保存在變量中。

讓someElement = $（“。your-class-name”）