Javascript JQuery：根据复选框单击更改表内行的颜色

我有一个

表

，其中包含大量数据。 现在我想做的是，当用户取消选中特定行的复选框时，我想将颜色更改为灰色。 我到目前为止所做的：

$('tr').click(function () {
    if(this.style.background == "" || this.style.background =="white") {
        $(this).css('background', 'grey');
    }
    else {
        $(this).css('background', 'white');
    }   
});

$(".uncheck").change(function(){
    alert("cehc");
    var ischecked= $(this).is(':checked');
    alert(ischecked);
    if(!ischecked){
        $(this).css('background', 'grey');
    }
    else{
        $(this).css('background', 'white');
    }
});

不过，我编写的上述函数可以单独正常工作。就像 当我单击行时，第一个函数将起作用，第二个函数在取消选中复选框时发出警告，但不会将颜色更改为灰色

---

如何识别表中某一行上的特定复选框是否已取消选中，并将该行颜色更改为灰色？

更改中的

此
指的是该复选框，而不是该行。您可以使用
最近的
方法确定行的目标：

$(this).closest('tr').css('background', 'grey');


$（'tr'）。单击（函数（）{
if（this.style.background==“this.style.background==”白色”）{
$（this.css（'background'，'grey'）；
}
否则{
$（this.css（'background'，'white'）；
}   
});
$（“.uncheck”）.change（函数（）{
警报（“检查更改”）；
var ischecked=$（this）.is（'：checked'）；
警报（已检查）；
如果（！已检查）{
$（this）.closest（'tr'）.css（'background'，'grey'）；
}
否则{
$（this）.closest（'tr'）.css（'background'，'white'）；
}
});

1.
1.
1.
您可以选中复选框属性：

    $(".uncheck").change(function(){
     alert("cehc");
      var ischecked= $(this).prop('checked');
      alert(ischecked);
      if(!ischecked){
      $(this).parent().closest('tr').css('background', 'grey');
   }
   else{
     $(this).parent().closest('tr').css('background', 'white');
   }
  });

试试这个：

$(".uncheck").change(function(){
    $(this).toggleClass('grey white')
});

这应该是你的css

.grey { background: grey; }
.white { background: white; }

尝试使用单个函数并使用css类：


$（文档）.ready（函数（）{
$（'tr'）。单击（函数（）{
var inp=$（this.find（'.check'）；
var tr=$（this.nexist（'tr'）；
inp.prop（'checked'，！inp.is（'：checked'））
tr.toggleClass（'isChecked'，inp.is（'：checked'）；
});
//单击复选框时不执行任何操作，但冒泡到tr
$（'.check'）。单击（函数（e）{
e、 预防默认值（）；
})
})
.isChecked{
背景颜色：灰色；
}
桌子{
宽度：100%；
边界塌陷：塌陷；
}
tr{
背景色：#fafafa；
}
/*通过元素单击*/
.检查{
指针事件：无；
}
如果在
中有复选框，则可以使用以下代码：

$(".uncheck").change(function(){
    var ischecked= $(this).is(':checked');
    if(!ischecked){
      $(this).closest('tr').css('background', 'grey');
    }
    else{
      $(this).closest('tr').css('background', 'white');
    }
});

on（）
触发
更改事件的任何
复选框
执行以下操作：

使用
这个
最近的（'tr'）
和
.find（'td'）
到
.css（'background'，'grey'）

一小条

$（'input[type=“checkbox”]”）。在（'change'，函数（e）上{
var self=这个；
如果（！自检）{
$（this）.closest（'tr'）.find（'td'）.css（'background'，'grey'）；
}
});
表格，
th，
运输署{
边框：1px纯黑；
}

CHX
可乐
可乐
单击
1
时添加一个，它不会触发OP中的更改功能question@Justinas我没有添加这个，因为OP说它有效。但是现在就可以了。