微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery DataTables – 缓慢启动,“正常”html表在开头显示

我正在使用jQuery DataTable插件,但是我担心脚本加载似乎需要一些时间,所以我的网页总是首先显示普通的html表,所有脚本完成后,表将变为DataTable。
我不认为这样的外观是可以接受的,所以我希望能在这里得到一些建议。是否可以使脚本更快,还是不要显示平面?
Btw,我在_Layout.cshtml头标记的_Scripts部分视图中调用我的脚本
@Html.Partial("_Scripts")

(UPDATE)
我试图隐藏表,并在datatable初始化后显示,但是,我得到一个没有表头的datatable。任何想法为什么会发生这种情况?

$('#stocktable').hide();
// Initialize data table
    var myTable = $('#stocktable').dataTable({

        // Try styling
        "sScrollX": "100%","sScrollXInner": "100%","bScrollCollapse": true,// To use themeroller theme
        "bJQueryUI": true,// To use Tabletool plugin
        "sDom": 'T<"clear">lfrtip',// Allow single row to be selected
        "oTabletools": {
            "sRowSelect": "single"
        },"fnInitComplete": function () {
            $('#stocktable').show();
        }

解决方法

我的注意事项是,我不熟悉_Scripts部分视图,所以下面的建议是我会给某人只是包含和调用JavaScript在“正常”的方式:

>调整纯HTML表格,使其与最终的表格具有相同的外观。如果您启用了jQuery UI(bJQueryUI:true),这意味着在“plain”表中拥有jQuery UI类,而不是等待DT添加它们。
>使用各种FOUC(闪存的无格式内容)技术来隐藏表,直到它准备渲染为止。 DataTables API有一些有用的回调,可以用于“显示它”的一部分,如fnInitCallback。最基本的(但可访问性有害的)技术是使用display:none来创建表,在回调中,使用$(‘#myTable’)。show()或一些变体。在互联网上搜索应该提供一些保存可访问性的好方法

除此之外,这只是一个(如你所说的)容忍“可接受”的问题。我们使用服务器端处理(返回远少的记录),一个脚本加载器,用于更快的脚本加载时间(我们正在尝试使用head.js,但还有其他!)以及脚本的最小化版本。即使这样,我们有时也会看到这个简单的表格,然后才成为DT,但是由于互联网用户习惯于在元素被加载之前看到页面被“建立”,所以这是一个可以接受的折衷。对你来说,可能不是。

祝你好运!

原文地址:https://www.jb51.cc/jquery/181942.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐