javascript - 如何使用 jquery 动态更改数据表？

Question

我正在制作一个响应式网站，所以我正在使用 datatables 因为它是响应式的我想在不同的 @ 中更改数据表外观媒体屏幕。我想要做的是，当我处于桌面版时，表格将处于正常状态，而对于平板电脑版，我希望它处于 FIXED COLUMNS 中。当在移动版时，我希望它像 Responsive Table像这样。最好的方法是什么？我需要创建多个表还是只使用脚本？请告诉我。

Answer 1

这应该可以解决问题。您需要先销毁第一个 DataTable，然后再对其进行初始化。

$(window).on('resize load', function () {
var width = $(window).width();
if (width < 720) {
    //for screens with less than 720px
    var table = $('#example').DataTable({
            destroy : true,
            "scrollY": "300px",
            "scrollX": "100%",
            "scrollCollapse": true,
            "paging": false
    });
    new $.fn.dataTable.FixedColumns(table);
} else {
    $('#example').DataTable({
        destroy : true,
        responsive: true
    });
}

}