解决方法
这应该适合你:
let example = $('#example').DataTable({ columnDefs: [{ orderable: false,className: 'select-checkBox',targets: 0 }],select: { style: 'os',selector: 'td:first-child' },order: [ [1,'asc'] ] }); example.on("click","th.select-checkBox",function() { if ($("th.select-checkBox").hasClass("selected")) { example.rows().deselect(); $("th.select-checkBox").removeClass("selected"); } else { example.rows().select(); $("th.select-checkBox").addClass("selected"); } }).on("select deselect",function() { ("Some selection or deselection going on") if (example.rows({ selected: true }).count() !== example.rows().count()) { $("th.select-checkBox").removeClass("selected"); } else { $("th.select-checkBox").addClass("selected"); } });
我已经添加到CSS了:
table.dataTable tr th.select-checkBox.selected::after { content: "✔"; margin-top: -11px; margin-left: -4px; text-align: center; text-shadow: rgb(176,190,217) 1px 1px,rgb(176,217) -1px -1px,217) 1px -1px,217) -1px 1px; }
工作JSFiddle,希望有所帮助.