我正在使用jQuery DataTable插件,但是我担心脚本加载似乎需要一些时间,所以我的网页总是首先显示普通的html表,所有脚本完成后,表将变为DataTable。
我不认为这样的外观是可以接受的,所以我希望能在这里得到一些建议。是否可以使脚本更快,还是不要显示平面?
Btw,我在_Layout.cshtml头标记的_Scripts部分视图中调用我的脚本
我不认为这样的外观是可以接受的,所以我希望能在这里得到一些建议。是否可以使脚本更快,还是不要显示平面?
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,但是由于互联网用户习惯于在元素被加载之前看到页面被“建立”,所以这是一个可以接受的折衷。对你来说,可能不是。
祝你好运!