DataTable固定标头不起作用

kyo*_*kyo 13 javascript jquery html-table datatables

我有一个使用datatables插件的表.

我正在尝试修复我的表头,并点击此链接:此处

$('.device-table').DataTable( {
    "fixedHeader": {
        header: true,
    },
    "bLengthChange": false,
    "Filter": false,
    "Info": false,
} );
Run Code Online (Sandbox Code Playgroud)

我没有看到效果.


我已经包含了数据表和fixedHeader的js文件:

<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/fixedheader/3.1.2/js/dataTables.fixedHeader.min.js" type="text/javascript"></script>
Run Code Online (Sandbox Code Playgroud)

如何进行调试?


我现在正在接受任何建议.

任何提示/建议/帮助将非常感谢!

Dek*_*kel 21

要使fixedHeader插件正常工作,您还需要以下css文件:

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/fixedheader/3.1.2/css/fixedHeader.dataTables.min.css">
Run Code Online (Sandbox Code Playgroud)

查看此更新:https:
//jsfiddle.net/s2xbf9d0/6/

  • 您弄乱了样式:)删除css中的`height:150px;`,而是在`DataTable`构造函数中设置`scrollY:'150px'`。在这里检查:http://jsfiddle.net/s2xbf9d0/11/ (2认同)

Dav*_*d R 6

您的小提琴似乎缺少dataTables.fixedHeader插件以及fixedHeader.dataTablesCSS文件,这导致您正确呈现页面(使用固定标题).

工作演示: - https://jsfiddle.net/s2xbf9d0/7/

希望这可以帮助!