bootstrap tab中嵌入dataTable切换时头部显示错误的解决方案

一个比较有意思的问题，当bootstrap tab中嵌套了jquery table后，当进行tab切换的时候，table的header会显示错落，如下图所示：

主要时因为当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(); }})