Question

我有一个jquery函数来选择所有复选框，这些复选框填充在PHP循环中。循环的输出类似于下面的内容：

<label class="check"><input type="checkbox" name="selectall" value="All"/> Select All</label>
<label class="col-md-3 col-xs-12 control-label">Types Of function</label>
<div class="col-md-6 col-xs-12">                                                                                            
    <div class="col-md-7">                                    
        <label class="check"><input type="checkbox"  name="chkUser" class="icheckbox"/> Birthday</label>
    </div>
    <div class="col-md-7">                                    
        <label class="check"><input type="checkbox"  name="chkUser" class="icheckbox"/> Family Function</label>                   
    </div>
    <div class="col-md-7">                                    
        <label class="check"><input type="checkbox"  name="chkUser" class="icheckbox"/> conference</label>                        
    </div>
    <div class="col-md-7">                                    
        <label class="check"><input type="checkbox"  name="chkUser" class="icheckbox"/> wedding</label>                           
    </div>
    <div class="col-md-7">                                    
        <label class="check"><input type="checkbox"  name="chkUser" class="icheckbox"/> Corporate</label>                             
    </div>
</div>

jquery函数是：

$('.selectall').click(function() { //alert('HHH');
    if ($(this).is(':checked')) {
        $('.icheckbox').attr('checked', 'checked');
    } else {
        $('.icheckbox').attr('checked', false);
    }
});

但遗憾的是它不起作用！怎么了？

Jsfiddle Here

Answer 1

使用 prop（）设置已选中和未选中

  $('[name=selectall]').change(function() {  
         $('.icheckbox').prop('checked', this.checked);
    });

注意：html中没有 selectall 类

<强> prop demo

attr domo 只能工作一次

Answer 2

您必须将class="selectall"添加到 selectall 复选框

<input type="checkbox" name="selectall" value="All" class="selectall">

建议使用 prop（），如Bala建议的那样。

Answer 3

$（document）.ready（function（） { $（＆＃39; [name = selectall]＆＃39;）。click（function（）{

            if ($(this).is(':checked')) {
                $('.icheckbox').attr('checked', 'checked');
            } else {
                $('.icheckbox').attr('checked', false);
            }
        });
    });

或将标签名称更改为Id并尝试下面的代码

$（document）.ready（function（） { $（＆＃39; #selectall＆＃39;）。点击（function（）{

            if ($(this).is(':checked')) {
                $('.icheckbox').attr('checked', 'checked');
            } else {
                $('.icheckbox').attr('checked', false);
            }
        });
    });

检查所有jquery不适用于动态填充的复选框

3 个答案: