Datatables插件固定列与bootstrap选项卡结合使用

Question

我在第二个标签上显示的datatables插件修复列有问题（带引导标签）

这是我的javascript代码

$(document).ready(function() {
  $('#PRtable').DataTable( {
    // fixedHeader: true,
    scrollX: true,
    oLanguage: {
      sInfoFiltered: ""
    },
    bFilter: false, 
    fixedColumns: { 
      leftColumns: 4 
    },
    orderable : false,
    // "aoColumnDefs": [
    // { "bSortable": false, "aTargets": [ "_all" ] }
    // ],
    scrollY: '50vh',
    scrollCollapse: true,
    paging:         false
  } );
  $('#KK2table').DataTable( {
    // fixedHeader: true,
    scrollX: true,
    oLanguage: {
      sInfoFiltered: ""
    },
    bFilter: false, 
    fixedColumns: { 
      leftColumns: 4 
    },
    orderable : false,
    "aoColumnDefs": [
      { "bSortable": false, "aTargets": [ "_all" ] }
    ],
    scrollY: '50vh',
    scrollCollapse: true,
    paging:         false
  } );
  $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
    $($.fn.dataTable.tables(true)).DataTable()
      .columns.adjust();
  });    
});
function test(e){
  document.getElementById('head'+e).innerHTML += "<br>Trident"; 
}

正如你在图片上看到的那样，列在“第二个标签”上变形了，但是如果我在第一个标签上显示它就完全正常。

此处jsfiddle code

更新：我忘了提一下，如果你看一下表，你会发现一个按钮会在第一列附加一些文字，但是它似乎是数据表插件制作重复的表格而我的javascript函数只在后面的表上工作数据表表

Answer 1

您已添加多个版本的DataTables - 1.9.4和1.10.15。删除旧版本后，它可以正常工作，请参阅updated example。