如何在jQuery中检查div中的所有复选框？

Question

编辑:

感谢答案的人,它看起来确实正确,它适用于jsfiddle.net,但在我的代码中警报启动很好,但复选框没有任何反应.:/

     $('#selectChb').click(function(){
         $(':checkbox').prop("checked", true);
         alert("1");
    });

     $('#deselectChb').click(function(){
         $(':checkbox').prop("checked", false);
         alert("2");
    });

...

<div id="chbDiv" class="ui-widget ui-widget-content ui-corner-all" >  <br></br>
  <table width="90%" border="0" align="center" cellpadding="5" cellspacing="0">
    <tr>
    <td colspan="2">Following:</td>
    <td>&nbsp;</td>
  </tr>
    <tr>
    <td width="25" align="left"><input type="checkbox" id="check1" /><label for="check1">&nbsp;</label></td>
    <td width="45" align="center"><img src="face_01.jpg" width="32" height="32"></td>
    <td>Andrew Lloyd Webber</td>
  </tr>
      <tr>
    <td width="25" align="left"><input type="checkbox" id="check2" /><label for="check2">&nbsp;</label></td>
    <td width="25" align="center"><img src="face_02.jpg" width="32" height="32"></td>
    <td>Richard Branson</td>
  </tr>
      <tr>
    <td width="25" align="left"><input type="checkbox" id="check3" /><label for="check3">&nbsp;</label></td>
    <td width="25" align="center"><img src="face_03.jpg" width="32" height="32"></td>
    <td>Dmitry Medvedev</td>
  </tr>
</table>
  <br>
  <table width="90%" border="0" align="center" cellpadding="5" cellspacing="0">
    <tr>
      <td><a href="#" id="selectChb" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-check"></span>Select All</a>&nbsp;
      <a href="#" id="deselectChb" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-close"></span>Deselect All</a></td>
      <td>&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    </table>
<br>

</div>
  <br>
  <div  class="ui-widget ui-widget-content ui-corner-all">

Answer 1

这是一个派生的终极解决方案,可以找到DIV中的所有复选框,并根据DIV之外的另一个复选框来检查或取消选中,该复选框表示检查/取消选中

    function checkCheckboxes( id, pID ){

    $('#'+pID).find(':checkbox').each(function(){

        jQuery(this).attr('checked', $('#' + id).is(':checked'));

    });     

}

用法:

<label>check/uncheck  
<input type="checkbox" id="checkall" value="1" 
onclick="checkCheckboxes(this.id, 'mycheckboxesdiv');" >
</label>

<div id="mycheckboxesdiv">
<input type="checkbox" value="test1" name="test">
<input type="checkbox" value="test2" name="anothertest">
<input type="checkbox" value="test3" name="tests[]">
<input type="checkbox" value="test1" name="tests[]">
</div>

优点是您可以使用独立的复选框集,并选中/取消选中与其他集无关的所有复选框.它很简单,无需使用每个复选框的id或类.

Answer 2

试试以下,

现场演示

$('#selectChb').click(function(){ 
     $(':checkbox').prop("checked", true);
});

Answer 3

尝试遍历找到的每个项目

$('#selectChb').click(function(){ 
   alert("c!");

   $('#chbDiv').find(':checkbox').each(function(){
      $(this).attr('checked', !checkbox.attr('checked'));
   });
});

Answer 4

试试这个代码

 $("#Div_ID").find('input[type=checkbox]').each(function () {
             // some staff
             this.checked = true;
        });