数据表列可见性与响应扩展

DataTables column visibility with Responsive extension

本文关键字：响应 扩展 可见性 数据表      更新时间：2023-09-26

我是jQuery数据表的新手。我刚刚读到关于DataTables提供的响应表特性，请看这个例子。

这里的列在窗口调整大小时隐藏，但问题是最后一列也隐藏。我们可以定义哪些列必须隐藏在不同的窗口大小吗?

请参阅类逻辑，了解细粒度控制每列何时可见。

例如，总是显示最后一列:

$(document).ready(function(){
    $('#example').DataTable({
       responsive: true,
       columnDefs: [
          targets: -1,
          className: 'all'
       ]
    });
});

其中columnDefs.targets设置为-1指向最后一列(列索引从右开始计数)，className: 'all'表示无论浏览器宽度如何，该列始终可见。

如果您可以编辑HTML，您可以将data-priority="1"属性添加到您不想隐藏的th元素。例:

<th data-priority="1">Last column</th>

相关文章：