css - 数据表处理信息不显示

Question

我在 jQuery UI TABS 中包含了我的服务器端处理数据表，但集成后处理信息不再显示:(
此 stackoverflow.com帖子写了一些关于隐藏的“处理...”-Div。
我的案例是否可能与“z-index”问题匹配？

这是数据表代码:

$(document).ready(function() {

    $('#example').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": {
            "url": "ajax_ssp_class.php",
            "type": "GET"
        },
        "order": [ [0,'asc'] ],
        "paging":true,
        "pagingType": "simple_numbers",
        "pageLength": 50,
        "lengthMenu": [[50, 100, 250, -1], [50, 100, 250, "All"]],
        "lengthChange": true
    } );
});

div是否存在的证明被测试为真:

<div id="example_processing" class="dataTables_processing" style="display: block; z-index: 10000;">Processing...</div>

解决方案
我在预绘图中添加了以下行。现在它起作用了。

"fnPreDrawCallback":function(){
    //alert("Pre Draw");
    $('#example_processing').attr('style', 'font-size: 20px; font-weight: bold; padding-bottom: 60px; display: block; z-index: 10000 !important');
}

Answer 1

在使用服务器端处理然后使用搜索、重新排序或更改页面大小时，我遇到了类似的处理文本没有显示的问题。解决方法是添加以下 CSS ...

<style type="text/css">
    .dataTables_processing {
        top: 64px !important;
        z-index: 11000 !important;
    }
</style>

这里的关键是 z-Index 和 top。

这也取决于有

"processing": true,

在您的数据表初始化中