【问题标题】:Table data loads, briefly and unformatted, before jquery DataTables loads.在 jquery DataTables 加载之前,短暂且未格式化的表数据加载。
【发布时间】:2018-12-14 15:19:05
【问题描述】:

在 jquery DataTables 加载之前,短暂且未格式化的表数据加载。我研究并发现很多人说解决方案是用 css 隐藏表,然后用 initComplete 在 jquery 中显示它。我尝试了以下方法,但似乎没有任何效果:

css:
#tblAccount {
    visibility:hidden;
}
#tblCustomer {
    visibility: hidden;
}

jquery:
$(function () {
    $("[id*=tblAccount], [id *= tblCustomer]").prepend($("<thead></thead>").append($(this).find("tr:first"))).DataTable({
        "paging": true,
        "lengthChange": true,
        "searching": true,
        "ordering": true,
        "info": true,
        "autoWidth": true,
        "responsive": true,
        "dom": 'lBfrtip',
        "buttons": ['excel', 'print', 'pdfHtml5'],
        "initComplete": function () {
            $('#tblAccount').show().css({ visibility: "visible" });
        $('#tblCustomer').show().css({ visibility: "visible" });
        }

    });
})

【问题讨论】:

  • jQuery 的 show() 函数将元素显示属性更改为“块”或等效项。所以你会更幸运地从两者中删除 .css() 部分,并将初始 css 更改为 'display: none' 而不是使用可见性。当您在上面运行代码时会发生什么?
  • 我尝试按照您的建议更改 css 为“显示:无”并从 jquery 中删除 css 部分。我得到了相同的结果,没有任何变化。在 DataTables 加载之前,我仍然会在短时间内看到未格式化的表格。清除缓存,结果相同。
  • 你在哪里设置 css 以显示:无,是 css 中的吗?
  • 是的,我在这样的样式表中显示:#tblAccount { display: none; }

标签: jquery css datatable


【解决方案1】:

我认为您不需要 .show() 函数并使用 css({ visibility: "visible" }) 更改 css。

如果您开始加载在#tblAccount 和#tblCustomer 上显示“显示:无”的页面,则保持拥有

$('#tblAccount').show();
$('#tblCustomer').show();

在 initComplete 函数中,您应该得到您正在寻找的功能。

【讨论】:

  • 嗨 Sara,请原谅偏离主题的评论(认为您可以在阅读后将其删除):我受到您最近的博客文章的启发,写下了我自己的“糟糕日子”(发生在 4 月和我已经发誓要忘记),并分享我对如何建立社区的想法:What two very bad days (and everything else) on Stack Exchange taught me about building Stack Exchange's community.
  • 不幸的是,我猜我对您帖子的回复被卡在垃圾邮件过滤器或某个地方,所以我选择了,违背我更好的判断,开始meta discussion。我的提议,就像你的帖子一样,受到社区的热烈欢迎(除了反对票)。无论如何,只是想你可能想看看(最好是 weebly 上的原始 7000 字帖子)。顺便说一句,你的帖子不错,谢谢分享!
猜你喜欢
  • 1970-01-01
  • 2014-09-16
  • 1970-01-01
  • 2020-02-10
  • 2011-11-18
  • 2013-05-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多