javascript - 带分割功能的 jQuery 多重选择器

Question

我这一行有两个 <td>其类 messageROW 和 titleROW 位于 ID 为“activecd”的复选框后面。我试图在切换复选框时更改 messageROW 和 titleROW (整行)的背景颜色，但 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 类(如果满足)复选框被选中，如果没有，则删除该类。