帶有拆分的jQuery多重選擇器

Question

我有一個帶有兩個<td>的行，其類別為messageROW和titleROW，其后為ID為' activecd '的復選框。 我試圖在切換復選框時更改messageROW和titleROW （整個行）的bg顏色，但titleROW僅更改顏色。

有什么建議么？

$('[id^=activecd]').change(function(){
    $('.messageROW,.titleROW'+$(this).prop('id').split('activecd')[1]).closest('td').toggleClass('colorcode', this);
});

HTML ：

 <tr> <td class="messageROW"></td> <td class="titleROW"></td> <td><input id="activecd"></td> </tr> 

Answer 1

我建議以下內容，盡管未經測試：

$('[id^=activecd]').change(function(){
    $(this).closest('tr').toggleClass('colorcode', this.checked);
});

這將偵聽指定元素上的change事件，找到最接近的tr元素，如果選中此復選框，則添加colorcode類，如果未選中，則刪除該類。

Answer 2

嘗試使用CSS $().add(selector) jQuery $().add(selector) ， $().toggleClass("bgOn")

<style>
.bgOn {background:rgb(255,230,230)} // any css to toggle.
</style>

我認為問題尚不明確。

<button onclick="someFunction(this)">Toggle color</button>

function someFunction(this){
  var $this=$(this);
  $this.parent().find(".messageROW,.titleROW").toggleClass("bgOn");
  // or
  $this.parent().parent().find("tr>td:first-child, tr>td:nth-child(2)").toggleClass("bgOn");
}

可能會幫助您。