什么'；这个jQuery addClass有什么问题

我是jQuery新手，对一些简单的代码很在行，但这一条让我感到困惑

我有一个复选框列表，我需要计算选中复选框的数量，并在文本框中显示计数。我想根据计数添加不同的类

如果1或2，则类

.blue

如果3个或更多，则类

。红色

如果选中了0和a“以上任何一项”复选框，则class.green *必须选中“无上述内容”复选框才能添加类

.green。

值为“0”是不够的。我需要用户意识到并确信“以上都没有”

我设法使它工作，并使选中状态在“以上无一项”和其他项之间切换

我仍然对addClass的故障感到困惑，如下所示：

我期望的是：

• 当我单击1或2个复选框时，类变为蓝色

• 如果我点击第三个，它就会变成红色

• 如果我不选中一个，它就会返回蓝色

• 如果未选中“全部”，则没有样式

• 如果勾选“以上无一项”，则它变为绿色

• 如果我取消选中任何复选框，那么类应该返回到以前的状态

这就是我得到的：

• 当选中3个或更多时，我没有得到

  '.red'

  类

• 如果我取消选中任何复选框，则类保持不变

• 如果我取消选中全部，而不考虑“上面的任何一个”，它就会消失

  “.green”

这是我的代码：

$('input:checkbox').change(function() {
  var a = $("input.ab:checked").length
  $(".count").val(a);
  var count = $(".count").val(a);
  var res = '0';
  var nota = $('input.nota:checked');

  if (a < 1 && nota) {
    var res = ('green');
  } else if (a < 3 && a > 0) {
    var res = ('blue');
  } else if (a => 3) {
    var res = ('red'); // not working !
  }
  count.addClass(res);
});
// toggle checked
$("input.ab").change(function() {
    $("input.nota").not(this).prop('checked', false);  
});

$("input.nota").on('change', function() {
    $(".count").val(0)
    $("input.ab").not(this).prop('checked', false);    
});

$（'input:checkbox'）。更改（函数（）{
变量a=$（“input.ab:checked”）.length
$（“.count”）.val（a）；
变量计数=$（“.count”）.val（a）；
var res='0'；
var nota=$（'input.nota:checked'）；
如果（a<1&¬a）{
var res=（‘绿色’）；
}否则如果（a<3&&a>0）{
var res=（'blue'）；
}如果（a=>3），则为else{
var res=（'red'）；//不工作！
}
count.addClass（res）；
});
//勾选
$（“input.ab”）.change（函数（）{
$（“input.nota”）.not（this）.prop（'checked'，false）；
});
$（“input.nota”）。在（'change'，function（）上{
$（“.count”）.val（0）
$（“input.ab”）.not（this）.prop（'checked'，false）；
});

Html:

选中计数、切换、向每个结果添加类
如果勾选了“以上任何一项”，则：绿色
如果计数=1或2，则：蓝色
如果数到3或更多，则：红色

AB


基础知识


ABDC


ABCDEF


以上各项均无（必须检查为绿色）


计数：

这是jsfiddle:

多谢各位。请记住，我在这里和jQuery中都是新手，所以请让我在投票否决我之前澄清、修正甚至删除我的帖子。我在发帖前尽了最大努力

编辑： 现在，除绿色外，该功能仅在以下情况下有效：

• 首先选中nota it，然后再选中任何其他复选框或

• 选中其他复选框后，它将保留上一个类，如果未选中（nota），它将变为绿色！！这是现在唯一的问题

更新的JSFIDLE:

更新代码：

$('input:checkbox').change(function() {
  var a = $("input.ab:checked").length
  $(".count").val(a);
  var count = $(".count").val(a);
  var res = '0';
  var nota = $('input.nota:checked');

  if (a < 1 && nota) {
    var res = ('green'); // this is only working when I uncheck the nota if other checkboxes were checked then the nota checked and unchecked
  } else if (a < 3 && a > 0) {
    var res = ('blue');
  } else if (a => 3) {
    var res = ('red'); 
  }
  count.removeClass( "green blue red" ).addClass(res);
});
// toggle checked
$("input.ab").change(function() {
    $("input.nota").not(this).prop('checked', false);  
});

$("input.nota").on('change', function() {
    $(".count").val(0)
    $("input.ab").not(this).prop('checked', false);    
});

$（'input:checkbox'）。更改（函数（）{
变量a=$（“input.ab:checked”）.length
$（“.count”）.val（a）；
变量计数=$（“.count”）.val（a）；
var res='0'；
var nota=$（'input.nota:checked'）；
如果（a<1&¬a）{
var res=（'green'）；//只有当我取消选中nota时，这才起作用。如果选中了其他复选框，则nota会被选中和取消选中
}否则如果（a<3&&a>0）{
var res=（'blue'）；
}如果（a=>3），则为else{
var res=（‘红色’）；
}
count.removeClass（“绿-蓝-红”）.addClass（res）；
});
//勾选
$（“input.ab”）.change（函数（）{
$（“input.nota”）.not（this）.prop（'checked'，false）；
});
$（“input.nota”）。在（'change'，function（）上{
$（“.count”）.val（0）
$（“input.ab”）.not（this）.prop（'checked'，false）；
});

编辑： 正在运行的最新代码除了一件事，如最后一把小提琴上的注释所示：

这是目前正在运行的代码，除了绿色（及其未更新的相关消息）问题：（包括对剩余问题的评论）

$（'input:checkbox'）。单击（function（）{
变量a=$（“input.ab:checked”）.length
$（“.count”）.val（a）；
变量计数=$（“.count”）.val（a）；
var res='0'；
var nota=$（'input.nota:checked'）；
/*除了在点击nota（绿色）后点击上面的一个选项之外，这项功能现在可以正常工作
然后它变为（1）并保持绿色（以及绿色的消息！），直到再次单击或单击另一个复选框，此时它变为蓝色（计数2）*/
if（nota.prop（'checked'）&¬a.prop（'checked'）==true）{
var res=（‘绿色’）；
}否则如果（a<3&&a>0）{
var res=（'blue'）；
}如果（a>=3），则为else{
var res=（‘红色’）；
}否则{var res=（''）；
}
count.removeClass（“绿-蓝-红”）.addClass（res）；
//每个人的信息
var msg='0'；
如果（a<1&¬a）{
var msg=（'some message here green'）；
}否则如果（a<3&&a>0）{
var msg=（'some message here blue'）；
}如果（a>=3），则为else{
var msg=（'some message here red'）；
}
$（'.message'）.val（msg）；
});
//勾选
$（“input.ab”）.change（函数（）{
$（“input.nota”）.not（this）.prop（'checked'，false）；
});
$（“input.nota”）。在（'change'，function（）上{
$（“.count”）.val（0）
$（“input.ab”）。不是（thi
$('input:checkbox').change(function() {
  var a = $("input.ab:checked").length
  $(".count").val(a);
  var count = $(".count").val(a);
  var res = '0';
  var nota = $('input.nota:checked');

  if (a < 1 && nota) {
    var res = ('green'); // this is only working when I uncheck the nota if other checkboxes were checked then the nota checked and unchecked
  } else if (a < 3 && a > 0) {
    var res = ('blue');
  } else if (a => 3) {
    var res = ('red'); 
  }
  count.removeClass( "green blue red" ).addClass(res);
});
// toggle checked
$("input.ab").change(function() {
    $("input.nota").not(this).prop('checked', false);  
});

$("input.nota").on('change', function() {
    $(".count").val(0)
    $("input.ab").not(this).prop('checked', false);    
});

        $('input:checkbox').click(function() {
          var a = $("input.ab:checked").length
          $(".count").val(a);
          var count = $(".count").val(a);
          var res = '0';
          var nota = $('input.nota:checked');

     /* This is working as expected now except when if I click on one of the above after the nota was clicked (green)
 it then goes (1) and stay green (AND the message for green too!) till clicked again or another checkbox clicked that's when it changes to blue (count 2). */

           if (nota.prop('checked') && nota.prop('checked') == true) {
           var res = ('green'); 
           } else if (a < 3 && a > 0) {
           var res = ('blue');
           } else if (a >= 3) {
           var res = ('red');
           }else{ var res = ('');
           }
           count.removeClass( "green blue red" ).addClass(res);

          // message for each
          var msg = '0';
          if (a < 1 && nota) {
            var msg = ('some message here green');
          } else if (a < 3 && a > 0) {
            var msg = ('some message here blue');
          } else if (a >= 3) {
            var msg = ('some message here red');
          }
          $('.message').val(msg);
        });

        // toggle checked
        $("input.ab").change(function() {
          $("input.nota").not(this).prop('checked', false);
        });

        $("input.nota").on('change', function() {
          $(".count").val(0)
          $("input.ab").not(this).prop('checked', false);
        });

  if (nota.prop('checked') && nota.prop('checked') == true) {
    var res = ('green'); // this is only working when I uncheck the nota if other checkboxes were checked then the nota checked and unchecked
  } else if (a < 3 && a > 0) {
    var res = ('blue');
  } else if (a >= 3) {
          var res = ('red'); 
  }else{
    var res = (''); 
        }
  count.removeClass( "green blue red" ).addClass(res);