jQuery DataTable是一種非常方便的數(shù)據(jù)表格插件,它提供了許多強(qiáng)大的功能,包括多選功能。通過多選功能,用戶可以勾選多個(gè)行,然后對(duì)這些行進(jìn)行批量操作。
要使用jQuery DataTable的多選功能,需要在初始化表格之前設(shè)置一些參數(shù)。首先,需要設(shè)置select參數(shù)為true:
$(document).ready(function() {
$('#example').DataTable({
select: true
});
});
接下來,可以通過調(diào)用row().select()方法來選中行。例如:
$(document).ready(function() {
var table = $('#example').DataTable();
$('#example tbody').on('click', 'tr', function () {
if ($(this).hasClass('selected')) {
$(this).removeClass('selected');
}
else {
table.$('tr.selected').removeClass('selected');
$(this).addClass('selected');
}
});
$('#button').click(function () {
alert(table.rows('.selected').data().length + ' row(s) selected');
});
});
在上面的代碼中,當(dāng)用戶點(diǎn)擊表格的某一行時(shí),會(huì)判斷該行是否已被選中。如果已選中,則移除選中狀態(tài),否則移除其他行的選中狀態(tài),并將該行設(shè)為選中狀態(tài)。
最后,可以通過調(diào)用rows().data()方法來獲取選中行的數(shù)據(jù),進(jìn)行批量操作。
總之,jQuery DataTable的多選功能可以方便地進(jìn)行批量操作。只需要簡(jiǎn)單地設(shè)置參數(shù)和調(diào)用方法,就可以實(shí)現(xiàn)這一功能。