如果选中包含多个复选框的 div 中的一个复选框，则将类添加到所有复选框答案

【问题标题】：If one checkbox within a div that contains multiple checkboxes is checked, add class to all checkboxes如果选中包含多个复选框的 div 中的一个复选框，则将类添加到所有复选框
【发布时间】：2014-08-31 08:02:16
【问题描述】：

如果只选中了该 div 中的一个复选框，我想为该 div 中的所有复选框添加一个类。我不认为我离得太远，但我被困住了。这就是我所拥有的。

var checkboxes = $("#myContent input[type='checkbox']");
$(document).on("click", checkboxes, function() {
    if(checkboxes.is(":checked")) {
        checkboxes.removeClass('invalid').addClass('valid');
    }
    else {
        checkboxes.removeClass('valid').addClass('invalid');
    }
});

我尝试用警报代替 addClass/removeClass，但是在选中和取消选中框时都会收到相同的警报（我在“else”语句中遇到的警报）。我一定很近，有人知道我错过了什么吗？

我的 HTML 如下（我也在用 Smarty）：

<div class="pd5" id="myContent">
                        {foreach from=$cLibrary key=k item=l}
                        <div class="clrBoth {cycle values=',AltRows0'} pd5 fLeft p100">
                            <input type="hidden" name="isform[{$k}]" value="{$l.isform}" class="valid" />
                            <div class="fLeft px20">
                                <input type="checkbox" value="{$k}" name="contentValue[{$k}]" id="contentData_{$k}" class="invalid" {foreach item=cn key=po from=$selectedContent}{if $cn eq $k} checked {/if}{/foreach} />
                            </div>
                        </div>
</div>

【问题讨论】：

var checkboxes = $("myContent input[type='checkbox']"); checkboxes.on("click", function () { if (this.checked) { checkboxes.removeClass('invalid').addClass('valid'); } else { checkboxes.removeClass('valid').addClass('invalid'); } });

标签： javascript jquery

【解决方案1】：

要检查条件，请使用if(this.checked)
如果您在变量中定义复选框选择器，则动态元素将不计算在内。所以委托事件是没有用的。

$(document).on("click", "#myContent :checkbox", function (e) {

    if (this.checked) {
        $('#myContent :checkbox').removeClass('invalid').addClass('valid');
    } else {
        $('#myContent :checkbox').removeClass('valid').addClass('invalid');
    }
});

Fiddle

【讨论】：

我很抱歉 - 添加我的问题时打错了！我确实有 # 因为它是一个 ID。
不幸的是，this.checked 也没有运气

【解决方案2】：

我找到了这个作品

 $(function(){

  $(".checkbox").on("click",function(){

    if($(this).is(":checked")){

      $(".checkbox").removeClass("invalid").addClass("valid");

    }else{

      $(".checkbox").removeClass("valid").addClass("invalid");
    }

  })
});


  <div id="wrapper">
   <input type="checkbox" class="checkbox">
   <input type="checkbox" class="checkbox">
   <input type="checkbox" class="checkbox">
    <input type="checkbox" class="checkbox">
  <input type="checkbox" class="checkbox">
</div>

【讨论】：