Javascript 引导3折叠面板内的Jquery Datatable响应插件

我在将Jquery数据表（带有自己的响应插件）放入Bootstrap3折叠面板时发现了一个问题

下面是一个有效的示例：

下面是一个不起作用的示例：

我发现的问题是

• 如果包裹桌子的面板在开始时折叠，即。 如下所示设置包装器div：
  ，表的列将不会 调整浏览器大小时折叠

• 如果包装表格的面板在开始时折叠，即如果我将“折叠”从类中移除，即
  ，或将“in”添加到其类中， i、 e.
  ，然后 这张桌子很好用。当窗口打开时，柱可以折叠 调整大小

但是，我希望折叠的面板在默认情况下保持关闭状态。因此，我必须在没有类“in”的类中添加“collapse”。

我还检查了引导源代码

.collapse {
  display: none;
}
.collapse.in {
  display: block;
}

我已经花了好几天的时间在这个问题上，仍然不明白为什么类“崩溃”会导致这个问题

---

提前谢谢大家。

我找到了解决问题的方法。加载页面后以编程方式隐藏面板。

我只是在做同一件事：引导折叠项与Jquery数据表相结合。关闭折叠项时，打开折叠项后dataTable不会正确显示。打开折叠项后，可以调整表格，这将按其应显示的方式显示表格：

$('.panel-collapse').on('shown.bs.collapse', function (e) {
  $($.fn.dataTable.tables(true)).DataTable().columns.adjust().responsive.recalc();
});

下面是一个工作示例：

来源：