我按照this example在我的数据表上添加了下拉过滤.当一个页面上只有一个表时，它工作得很好，但我有一个场景，其中有两个表.
根据DataTables文档(link 1link 2)，API可以同时访问所有DataTables实例.
所以，我试着在每张桌子上
这api().表([0]).列([3，4]).every(函数(){
但过滤下拉列表仅出现在第一个表中.
$('#table1').DataTable({
"dom": '<"dtWrapper"<f>lrti<"paginate0rem"p>>',
drawCallback: function(){
if (feather) {
feather.replace({
width: 14,
height: 14
});
}
},
orderCellsTop: true,
initComplete: function () {
这api().表([0]).列([3，4]).every(函数(){
let column = this,
select = $('<select class="form-control"><option value=""></option></select>')
.appendTo($('thead tr:eq(1) th:eq(' + this.index() + ')'))
.on('change', function () {
let val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false)
.draw();
});
column.data().unique().sort().each(function (d, j) {
select.append('<option value="'+d+'">'+d+'</option>')
});
});
}
});
$('#table2').DataTable({
"dom": '<"dtWrapper"<f>lrti<"paginate0rem"p>>',
drawCallback: function(){
if (feather) {
feather.replace({
width: 14,
height: 14
});
}
},
orderCellsTop: true,
initComplete: function () {
this.api().tables([1]).columns([2, 3]).every( function () {
let column = this,
select = $('<select class="form-control"><option value=""></option></select>')
.appendTo($('thead tr:eq(1) th:eq(' + this.index() + ')'))
.on('change', function () {
let val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false)
.draw();
});
column.data().unique().sort().each(function (d, j) {
select.append('<option value="'+d+'">'+d+'</option>')
});
});
}
});