jQuery在选中复选框时更改表行的背景色

我在一个表中有5列。第1列有一个名为name=“strurl1”、name=“strurl2”、name=“strurl3”等的复选框。如果选中，表格行背景色将从#f1f1f1更改为#e5

我试过了，但代码不起作用

主要的css是

.overviewtable tbody tr td {
    line-height:normal;
    border-top:1px solid #FFF;
    border-bottom:1px solid #c4c4c4;
    height:35px;
    padding-top:10px;
    padding-bottom:5px;
    background-color:#f1f1f1;
}

.overviewtable tbody tr td.col1 {
    width:316px;
    padding-left:15px;
    border-left:4px solid #FFF;
    font-size:12px;
    color:#999999;
}

表列的名称为col1、col2、col3、col4和col5

---

有什么帮助吗？提前谢谢。

要突出显示该行吗？使用.closest（）方法获取行元素，然后向其添加高亮显示类：

1

2

3

功能突出显示（obj）{
$（obj）.parent（）.parent（）.css（“背景”，“#000”）；
}

我已在t车身tr td类别中指定了背景色，如下所示：

.overviewtable tbody tr td {
  line-height:normal;
  border-top:1px solid #FFF;
  border-bottom:1px solid #c4c4c4;
  height:35px;
  padding:10px 0 5px 0;
  background-color:#f1f1f1;
}

如果我使用以下脚本，那么它只突出显示col1，即包含复选框的列。我将col1切换到col5，即高亮显示整行：

$(function() {
   $('td:first-child input').change(function() {
       $(this).closest('table.overviewtable tbody tr td').toggleClass("highlight", this.checked);
   });
});

---

发布您尝试过的代码，但不起作用。我已在tbody tr td中指定了如下背景色：。概述tbody tr td{线条高度：正常；边框顶部：1px solid#FFF；边框底部：1px solid#c4c4；高度：35px；填充顶部：10px；填充底部：5px；背景色：#f1f1；}如果我提到$（function（）{$（'td:first child input'）.change（function（）{$（this）.closest（'table.overviewtable tbody tr td'）.toggleClass（“highlight”，this.checked）；}）；然后只突出显示包含复选框的第一列。如果我在表中有一个复选框选中/取消选中所有复选框，该怎么办？@FawadGhafoorasXaineeKhan：有很多方法可以处理这个问题，对我来说，我更喜欢触发事件：

$（'th:first child input'）.change（function（）{$（'td:first child input'）.trigger（'change'）；}

$(function() {
   $('td:first-child input').change(function() {
       $(this).closest('table.overviewtable tbody tr td').toggleClass("highlight", this.checked);
   });
});