原文代碼
jsp頁面:
<table>
<thead>
<tr>
<th>序號<input type="checkbox" id="all"></th>
<th>員工號</th>
<th>用戶名稱</th>
</tr>
</thead>
<tbody id="dataTableTbody">
</tbody>
</table>
js代碼:
將查詢的值展示到頁面上
dataList += '<tr>';
dataList +='<td><input type="checkbox" lay-skin="primary" name="packageId" value="' + dataArray.id + '"></td>';
dataList +='<td>' + dataArray.pPackageName + '</td>';
dataList +='<td>' + dataArray.zxName+ '</td>';
dataList += '</tr>';
$('#dataTableTbody').html(dataList);
全選和取消全選
//全選按鈕狀態顯示判斷
$(document).off('click', '#dataTableTbody input[type=checkbox]').on('click', '#dataTableTbody input[type=checkbox]', function() {
var nocheckedList = $("#dataTableTbody").find('input:not(:checked)');
if(nocheckedList.length == 0){
$("#all")[0].checked = true;
}else{
$("#all")[0].checked = false;
}
});
// 全選/取消
$("#all").click(function(){
if($(this).is(':checked')){
$("#dataTableTbody").find('input').each(function(){
$(this).prop("checked",true);
})
}else{
$("#dataTableTbody").find('input').each(function(){
$(this).prop("checked",false);
})
}
});