0

好的，当我在页面上隐藏元素中的表上加载数据表时，我发现了一个问题。我所拥有的是少数基于“选项卡”的页面，当时唯一可见的是活动选项卡，而在激活之前的所有其他选项卡都是display:none. 当我手动调用一个选项卡作为主选项卡时，表或其列没有问题。仅当标签最初隐藏出表格的初始显示是一个问题时，它才有问题。

我说初始显示是因为当我单击列标题对给定列进行排序时，表格似乎会自行更正，并且列不再挤压/压缩在一起。

这是我当前的数据表代码

$('#'+tableID).dataTable(
{
    "sPaginationType": "full_numbers",
    "bPaginate": false,
    "bFilter": false,
    "bAutoWidth": true,
    "sScrollY": tableY+"px",
    "bScrollCollapse": true,
    "oLanguage": {
        "sInfo": "Showing _END_ Events."
    },
    "aaSorting": [[ 1, "asc" ]],
    "aoColumns": [
         null,
         null
       ]
});

我试图指定列宽，如：

"aoColumns": [
         { "sWidth": "80%" },
         { "sWidth": "20%" }
       ]

这也行不通。所以我现在被困住了，试图解决这个问题，但不确定从哪里/如何开始。

另外为了争论，可以说我的表结构类似于..

<table>
   <thead>
     <tr><td></td><td></td></tr>
   </thead>
   <tfoot>
     <tr><td></td><td></td></tr>
   </tfoot>
   <tbody>
     <tr><td></td><td></td></tr>
     <tr><td></td><td></td></tr>
     <tr><td></td><td></td></tr>
   </tbody>
</table>
4

1 回答 1

0

我最终通过搜索解决了我自己的问题，并基于与数据表/jquery ui 相关的 API 文档中给出的示例。

我的解决方案是绑定到 jquery ui 的选项卡事件，然后启动我的函数以根据选择的选项卡构建我需要的表。

$(document).ready(function() {
    $("#storage").bind('tabsselect', function(event, ui)
    {
        if (ui.index === 1)
        {
            tables.statistics("metrics", "metric");
        }
    });
});
于 2012-05-31T19:00:42.043 回答