javascript - 调整可以隐藏的表格列的大小

Question

我有一个标准表格，可以选择隐藏列，我想使用插件来调整列的宽度。

我尝试使用 colRessized 和 ressizedColumns 但当我隐藏一列然后尝试时，事情会变得困惑重新调整大小。

编辑: 我的表格:

<table id="mytable">
<thead>
    <tr><th class="column1"></th>text 1 <th class="column2">text 2</th></tr>
</thead>
<tbody>
    <tr><td class="column1"> cell00 </td> <td class="column2"> cell01 </td></tr>
    <tr><td class="column1"> cell10 </td> <td class="column2"> cell11 </td></tr>
    <tr><td class="column1"> cell20 </td> <td class="column2"> cell21 </td></tr>
</tbody>
</table>

激活colRessized:

$("#mytable").colResizable({
    liveDrag:false, 
    gripInnerHtml:"<div class='grip'></div>", 
    draggingClass:"dragging",
    minWidth:50         
});

隐藏/显示列的函数:

function toggleColumn(index){
    if(something){
        $('.column'+index).hide();
    }else{
        $('.column'+index).show();
    }
$("#"+tableID).colResizable({
    disable:true
});                                             
$("#"+tableID).colResizable({
    disable:false,
    liveDrag:false, 
    gripInnerHtml:"<div class='grip'></div>", 
    draggingClass:"dragging",
    minWidth:50         
});
}

每次切换后，我都会重新启动colResizable，以便它可以获得新值。

当我重新调整隐藏列之外的任何列的大小时，问题就出现了。

我还需要为每列设置默认宽度的选项。欢迎所有建议。

Answer 1

colResizable 1.5 与隐藏列兼容。您可以在 http://www.bacubacu.com/colresizable 下载

如果您想在激活 colResizable 后更改列可见性，则必须遵循以下步骤:

1. 调用 colResizable(像往常一样)
2. 在执行任何 DOM 修改(例如隐藏列)之前，请使用disable:true 销毁 colresible
3. 更改列可见性
4. 再次调用 colResizable