jquery - 数据表 - 在页面加载时，表格布局不会立即加载

Question

datatables.js 存在问题 - 当页面加载时，带分页的 css 稍微延迟，因此在显示带分页的 css 之前，整个数据最初显示得非常快。

同样的问题出现在这个 fiddle 上，当重新加载页面时你可以看到它闪烁，首先显示没有分页的表格，然后显示分页(但是这个 fiddle 的效果非常快，特别是在 chrome 上；在 firefox 上它更慢并且更引人注目(对我而言)，但在我的应用程序中它非常引人注目且看起来很糟糕。
Datatables example

我尝试过订购样式和脚本，还尝试将内容放在页脚中(目前都在页眉中)，但这似乎并不重要。我还发现了另一个带有数据表的 fiddle ，它在页面加载时显示了相同的内容:( some other datatables example )。是错误吗？

以下是涉及的脚本和样式:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"  type="text/css" rel="stylesheet">

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css"/>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" type="text/javascript"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.15/js/dataTables.bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<script src="{{ base_url }}application/assets/js/datatablejs.js" type="text/javascript"></script>

Answer 1

根据评论:

CSS:

#list {
    display: none;
}

JS:

$('#list').DataTable({
    "columns": [ 
        { 
            "width": "45%" 
        }, 
        null, 
        null
    ],
    "initComplete": function(){ 
        $("#list").show(); 
    }
});

工作 JSFidlle here .希望对您有所帮助。