Javascript 引导嵌套选项卡在重新选择之前不显示

我正在使用嵌套选项卡为我的应用程序设计一个管理面板。下面是选项卡设置方式的基本示意图

最初是活跃和可见的

-1a初始活动且可见

-1b不活跃

-1c非活性

不活跃

-2a最初处于活动状态，但不可见

-2b不活跃

-2c非活动

2a最初不可见，因为其父级（2）未处于活动状态，但2a具有以下标记：

<li class='active'>

当我单击选项卡2时，选项卡2a似乎处于活动状态，但选项卡窗格为空。查看页面源代码显示，选项卡窗格中有2a的数据。为了查看它，我必须单击选项卡2b，然后单击返回到选项卡2a。我的第一个想法是从2a中删除.active。然后，这要求用户单击2a将其激活，而不是取消激活然后重新激活以显示内容。我想做的是，当单击选项卡2时，2a立即可见。对不起，解释得太长了。下面是代码，如果您更容易进行排序的话

我将HTML代码放在这个JSFIDLE中，因为它太长，无法包含在文章中

编辑：

下面是一把小提琴，它准确地显示了我试图纠正的问题：

---

确保将结果窗格拖得尽可能宽，以便内容按预期显示。单击最左侧菜单中的“用户”按钮时，最初处于活动状态的窗格内容不会显示。您必须单击“添加用户”或“垃圾箱”，然后单击返回“用户”以查看窗格内容

我想您必须手动将活动类添加到窗格中，以便在切换到该选项卡时使其处于活动状态

---

这是我所能想到的最简单的解决方案，希望它能有所帮助。

我认为当您切换到该选项卡时，您必须手动将活动类添加到窗格中，使其处于活动状态。

我更新了您

---

这是我能想到的最简单的解决方案，希望它能有所帮助。

如果你做一把简化的工作小提琴，它会更有帮助。我在问题中添加了一把工作小提琴。如果你做一把简化的工作小提琴，它会更有帮助。我在问题中添加了一把工作小提琴。是的！成功了。非常感谢！对成功了。非常感谢！