1. 程式人生 > 其它 >table checkbox 列全選或全不選

table checkbox 列全選或全不選

html標籤:

<table class="table table-striped table-bordered table-hover" style="border: 1px solid lightgray; table-layout: fixed">
<thead>
<tr>
<th scope="col" style="text-align: center;width: 30px;"><input type="checkbox" class="th_check_all" name="check_box" /></th>
<th scope="col" style="text-align: center; width: 80px;">操作</th>
<th scope="col" style="text-align: center; width: 100px;">計劃週期</th>
</tr>

</thead>

<tbody>

<tr>
<td style="text-align: center;">
<input name="ckb" type="checkbox" value ="" />
</td>
<td style="text-align: center;">
已接收
</td>
<td style="text-align: center;"><%=obj.GetValue<string>("planperiodtime","") %></td>

</tr>

</tbody>
</table>

 

JS:

$(".th_check_all").click(function () {

        if ($(this).is(':checked') == true) {

            $("input[name='ckb']").prop("checked", true);

        } else {

            $(

"input[name='ckb']").prop("checked", false);

        }

    });