css - 具有固定标题、水平和垂直滚动的数据表

Question

我正在寻找具有固定标题、水平和垂直滚动的数据表 html 结构。我正在开发一个已经开发的数据表小部件。我发现了这个例子https://datatables.net/examples/basic_init/scroll_xy.html其中的 html 结构类似于我在我的小部件中的结构。我想在上面的示例中询问标题如何滚动，即使滚动位于表的主体上。如果它是由 JavaScript 完成的，当我们水平滚动它时，标题 css 属性仍然没有变化。

Answer 1

添加此脚本以调用您的表 ID

$(document).ready(function () {
$('#tableid').DataTable({
"scrollX": true,
"scrollY": 300,
"paging": false,
});
$('.dataTables_length').addClass('bs-select');
});

欲了解更多信息：https ://mdbootstrap.com/docs/jquery/tables/scroll/

Answer 2

我的经验是，如果您完全按原样使用上面的示例，即同一个表类，它应该可以工作，但是当您引入其他引导类时，也许您想将数据导出到 Excel 功能添加到表中，事情变得复杂了。很难找到“一刀切”的解决方案，您的解决方案取决于附加的类/CSS。