Question

但是当我点击require时，什么也没发生。我想点击require，然后更改option2的字体颜色，取消选中option2即可删除其类。

错误是什么？选择就在那里。感谢

jQuery(document).ready(function(){
  $('#id_run_options_0').change(function(){
       if (this.checked){
          alert('checked');
          $('#id_run_options_1').addClass('highlight-option2');
       }else{
          alert('unchecked');
          $('#id_run_options_1').removeClass('highlight-option2');
}});
});

Answer 1

您正在尝试更改复选框的类（因此是颜色），但您应该更改标签的类（其父元素）。

以下是您的代码的简短版本：

$("#id_run_options_0").change(function() {
  $("#id_run_options_1").parent().toggleClass("highlight-option2", this.checked);
});

DEMO： http://jsfiddle.net/Wwdmm/6/

Answer 2

您可以使用toggleClass方法

简化班次切换

jQuery(document).ready(function(){
  $('#id_run_options_0').change(function(){
      $('#id_run_options_1').parent().toggleClass('highlight-option2');
  });

  $('#id_run_options_1').change(function(){
      $('#id_run_options_1').parent().toggleClass('highlight-option2');
  });    
});

jsFiddler demo

Answer 3

即使这段代码也能解决

$('#id_run_options_0').click(function(){
            $('label[for="id_run_options_1"]').toggleClass('highlight-option2');
        });

jsFiddle demo link

选中一个复选框并更改其他选项的字体颜色

3 个答案: