Question

我的这行有两个<td>，其中包含 messageROW 和 titleROW 类，其后面是一个ID为＆＃39; <的复选框。强> activecd ＆＃39 ;.当切换复选框时，我尝试更改 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

的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");
}

可能会帮到你。

jQuery多选择器与拆分

2 个答案: