Jquery计数复选框并覆盖css答案

【问题标题】：Jquery count checkboxes and override cssJquery计数复选框并覆盖css
【发布时间】：2013-11-21 03:09:22
【问题描述】：

我正在使用在另一篇文章中找到的 jQuery 来计算选中的复选框。

jQuery

$(document).ready(function () {
    $("input[type=checkbox]").each(function () {
        $(this).change(updateCount);
    });
    updateCount();

    function updateCount () {
        var count = $("input[type=checkbox]:checked").size();
        $("#count").text(count);
        $("#statusCount").toggle(count > 0);
    }
});

HTML

<div id="statusCount" class="text-center mbm">
    <span id="count">0</span><br/>
    <span class="featurecounter">Plans Selected</span>
</div>

我的问题：

我需要在 jQuery 中做什么才能实现以下目标：

检查当前计数是否 > 4
如果 1 为真，则更改 .statusCount {background-color:red}

基本上如果用户选择超过，背景会变成红色。

【问题讨论】：

你不应该使用 size() api.jquery.com/size
只是一个问题——你知道这个当前的 updateCount() 是做什么的吗？
注意.. 谢谢 A. Wolff

标签： jquery css checkbox background-color

【解决方案1】：

在你的函数updateCount中试试这个代码

if (count > 4) {
   $("#statusCount").css('background-color','red');
} else {
   $("#statusCount").css('background-color','');
}

演示：http://jsfiddle.net/CAs2s/1/

【讨论】：

谢谢 zzlalani！这成功了。真的很简单。我需要戒掉拖延，学习 JS。
不过有一个问题。当我取消选中复选框时，使总数回到
是的，我没有拿出任何一个，并用原始颜色的十六进制替换它，效果也很好。再次感谢 zzlalani！

【解决方案2】：

如果选中count > 4，请尝试添加类.statusCount

$("input[type=checkbox]").change(updateCount);
updateCount();

function updateCount () {
  var count = $(":checkbox:checked").length;
  $("#count").text(count);
  $("#statusCount").toggle(count > 0);
  if (count > 4) {
     $("#statusCount").addClass('statusCount');
  }
};

【讨论】：