Question

当选中一个特定的复选框时，我已经将一些jQuery放在一起以更改容器上的突出显示（默认为红色，检查时为黑色）。我觉得这段代码可以简化，但不确定如何。有人有什么想法吗？

$("#container input:checkbox[id=cbTermsAndConditions]").change(function() {
   if ($(this).attr("checked")) {
     $('#container').addClass("containerblack");
     $('#container').removeClass("containerred");
   } else {
     $(this).parent().addClass("containerred");
     $(this).parent().removeClass("containerblack");
   }
});

由于

Answer 1

使用click事件，因为复选框的值不会改变，如果你所做的只是添加和删除类，你可以使用切换类。

Answer 2

小清洁工：

$("#container input:checkbox[id=cbTermsAndConditions]").click(function() {
   var $this = $(this);
   if ($this.attr("checked")) {
     $('#container').toggleClass("containerblack containerred");
   } else {
     $this.parent().toggleClass("containerred containerblack");
   }
});

此外，您可以使用原始javascript获取“已检查”值，将if语句替换为：

if(this.checked)

Jquery在复选框更改时更改css类

2 个答案: