bootstrap tab中嵌入dataTable切换时头部显示
2017-05-31 本文已影响158人
张晓刚_云字节
一个比较有意思的问题,当bootstrap tab中嵌套了jquery table后,当进行tab切换的时候,table的header会显示错落,如下图所示:
![](https://img.haomeiwen.com/i2183778/b48f9a0ca7344117.png)
主要时因为当table被隐藏后,table的header宽度会计算错乱,解决方案就是在table切换的时候重新调整列的宽度。具体代码如下:
$('.agent_tab').on('shown.bs.tab', function (e) { var table = $.fn.dataTable.fnTables(true); if ( table.length > 0 ) { $(table).dataTable().fnAdjustColumnSizing(); }})