js的寫法在標題行增加全選復選框和反選按鈕,在
數據行增加帶name屬性的復選框。
<table border="1" align="center" width="80%">
<tr>
<th><input
type="checkbox" id="checkall" onclick="checkall()"/><input
type="button" value="反選" onclick="inverseChk()"/></th>
<th>主鍵序號</th>
。。。。。。。
</tr>
<tbody>
<c:forEach items="${page.list }"
var="recruit">
<tr align="center">
<td><input type="checkbox"
name="checkid" value="${recruit.nid }" /></td>
<td> ${recruit.nid }</td>
<td>${recruit.cjob }</td>
。。。。。。
</tr>
</c:forEach>
</tbody>
</table>
2.全選和全不選 兩種實現方式:
第一種:
//全選和全不選(prop())(jq 的循環方式)
function checkAll(){//獲取數據行的所有復選框
var bankchk=$("[name='checkid']");
var banks=$("#checkall").prop("checked");
//jq的each循環,
$.each(bankchk,function(){
$(this).prop("checked",banks);
})
}
第二種
function checkall(){
$("
[name='checkid']").prop("checked",$("#checkall").prop("checked"));
}
3.反選
function inverseChk(){
var checkids= $("
[name='checkid']");
$.each(checkids,function(){
$(this).prop("checked",!$(this).prop("checked"));
})
}