如何選擇所有複選框？

我寫這樣的代碼如何選擇所有複選框？

<div style="margin-left:12px;"> 
    <input type="checkbox" id="chkbox" /> 
    <span style="margin-left:5px; position:relative; top:2px;" id="lblchkbox">Select All</span> 
</div> 
<table id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction" border="0"> 
    <tr> 
     <td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_0" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$0" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_0">Alabama</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_1" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$1" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_1">Alaska</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_2" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$2" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_2">Arizona</label></td> 
    </tr> 
    <tr> 
     <td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_3" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$3" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_3">Arkansas</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_4" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$4" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_4">California</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_5" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$5" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_5">Colorado</label></td> 
    </tr> 
    <tr> 
     <td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_6" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$6" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_6">Connecticut</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_7" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$7" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_7">Delaware</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_8" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$8" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_8">District of Columbia</label></td> 
    </tr> 
    <tr> 
     <td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_9" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$9" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_9">Florida</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_10" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$10" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_10">Georgia</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_11" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$11" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_11">Hawaii</label></td> 
    </tr> 
    <tr> 
     <td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_12" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$12" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_12">Idaho</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_13" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$13" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_13">Illinois</label></td><td><input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_14" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$14" /><label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_14">Indiana</label></td> 
    </tr> 
    <tr> 
     ... 
    </tr> 
</table>

現在我想，當我將檢查ID爲「chkbox」，那麼表中所有的複選框都應該進行檢查，如果它的勾選，那麼表中的所有複選框的複選框應該取消選中...

請幫忙!!!

來源

2016-02-04 Nida

綁定change()事件處理程序，並使用prop()方法更新其它複選框。您可以使用:checkbox選擇所有複選框。

$('#chkbox').change(function() { 
 
// change event handler to `chkbox` 
 
    $(':checkbox').prop('checked', this.checked); 
 
    // updating checked property of all checkbox based on `chkbox` 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div style="margin-left:12px;"> 
 
    <input type="checkbox" id="chkbox" /> <span style="margin-left:5px; position:relative; top:2px;" id="lblchkbox">Select All</span> 
 
</div> 
 

 
<table id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction" border="0"> 
 
    <tr> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_0" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$0" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_0">Alabama</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_1" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$1" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_1">Alaska</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_2" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$2" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_2">Arizona</label> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_3" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$3" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_3">Arkansas</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_4" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$4" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_4">California</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_5" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$5" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_5">Colorado</label> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_6" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$6" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_6">Connecticut</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_7" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$7" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_7">Delaware</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_8" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$8" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_8">District of Columbia</label> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_9" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$9" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_9">Florida</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_10" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$10" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_10">Georgia</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_11" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$11" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_11">Hawaii</label> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_12" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$12" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_12">Idaho</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_13" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$13" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_13">Illinois</label> 
 
    </td> 
 
    <td> 
 
     <input id="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_14" type="checkbox" name="ctl00$cphAgents$UploadDoc$ctlJurisdiction1$chklJurisdiction$14" /> 
 
     <label for="ctl00_cphAgents_UploadDoc_ctlJurisdiction1_chklJurisdiction_14">Indiana</label> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    ... 
 
    </tr> 
 
</table>

來源

2016-02-04 09:32:36

你可以像使用prop()功能如下。

$('#chkbox').change(function() { 
    var all = $('table').find('input[type="checkbox"]'); 
    if (this.checked) { 
     all.prop('checked', true); 
    } else { 
     all.prop('checked', true); 
    } 
});

來源

2016-02-04 09:33:32 Azim

如何選擇所有複選框？

回答

相關問題