切換元素父級的前一個兄弟節點上的類

Question

當單擊某些元素時，我想切換該元素的父節點的前一個兄弟節點（不是全部，只是一個）的類，該兄弟節點沒有特定的類（'item '） 已經。

HTML：

<tr id="product1"> 
    <td>Product</td> 
    <td>Text</td> 
</tr> 
<tr class="item" id="sku1"> 
    <td>SKU</td> 
    <td class="valueButton">Button</td> 
    <td>Text</td> 
</tr> 
<tr id="product2"> 
    <td>Product</td> 
    <td>Text</td> 
</tr> 
<tr class="item" id="sku2"> 
    <td>SKU</td> 
    <td class="valueButton">Button</td> 
    <td>Text</td> 
</tr> 
<tr class="item" id="sku3"> 
    <td>SKU</td> 
    <td class="valueButton">Button</td> 
    <td>Text</td> 
</tr> 

JS：

$(document).on({ 
    click: function() { 
     $('tr', $(this).parent().prev(":not('.item')")).toggleClass('blueChecked'); 
    } 
}, "tr.item td:not('.valueButton')"); 

Answer 1

使用.prevAll()並保持第一隻..

$(this).parent().prevAll(':not(.item)').first().toggleClass('blueChecked'); 

您使用的prev只檢查緊鄰的前一個元素。如果匹配它，選擇器將針對該元素進行測試。

演示在http://jsfiddle.net/UtJPS/

Answer 2

我認爲這可能做到這一點：

$('table').on('click', 'td', function() { 
    var $tr = $(this).closest('tr'); 
    var $last = $tr.siblings() 
     .filter(':not(.item)') 
     .filter(':lt('+ $tr.index() + ')') 
     .last(); 
    if ($last.length) { 
     $last.toggleClass('blueChecked'); 
    } 
});