在datatable jquery中显示选中的复选框个数,可以通过以下步骤实现:
<table id="myTable">
<thead>
<tr>
<th><input type="checkbox" id="selectAll"></th>
<th>列1</th>
<th>列2</th>
<th>列3</th>
</tr>
</thead>
<tbody>
<!-- 表格数据行 -->
</tbody>
</table>
$(document).ready(function() {
var table = $('#myTable').DataTable({
columnDefs: [{
orderable: false,
className: 'select-checkbox',
targets: 0
}],
select: {
style: 'multi',
selector: 'td:first-child'
},
order: [[1, 'asc']]
});
// 全选或取消全选
$('#selectAll').on('click', function() {
if ($(this).is(':checked')) {
table.rows().select();
} else {
table.rows().deselect();
}
});
// 监听选中行的变化
table.on('select deselect', function() {
var selectedRows = table.rows({ selected: true }).count();
console.log('选中的复选框个数:' + selectedRows);
});
});
在上述代码中,我们使用了DataTables的select扩展来实现行选中功能。通过监听select和deselect事件,可以获取当前选中的行数,并将其显示在控制台中。
值得注意的是,这里的代码只是一个示例,你可以根据实际需求进行修改和扩展。另外,如果你需要使用腾讯云的相关产品来支持云计算,可以参考腾讯云的文档和产品介绍页面,选择适合的产品来满足你的需求。
领取专属 10元无门槛券
手把手带您无忧上云