我正在处理一个使用jQuery 1.10.2和jQuery UI 1.10.4的旧项目，以在带有2层选项卡的对话框窗口中显示用户生成的数据。由于用户可以创建的选项卡数量没有上限（并且本机jQuery解决方案看起来很糟糕），我一直在寻找溢出选项卡的解决方案。另外：我项目中的标签上都带有状态图标，因此对于用户而言，一次能够查看同一层上的所有标签标签很重要。
这是一个JSFiddle，具有页面数据和页面结构的简化版本：https://jsfiddle.net/megahra/uexr4qfw/266/
它包括Paul Blundell的OverflowTabs plugin的修改版本，该版本已更新with the help of Twisty。
不幸的是，当您打开任何其他标签时，它看起来像这样：
我的首选解决方案是找到一种将此插件应用于所有选项卡行的方法，无论它们在页面层次结构中的位置如何。我怀疑问题是jQuery UI Tabs将css属性“ display：none”应用于与当前未显示的选项卡相对应的所有内容div。这可能会使插件无法处理这些div（例如，在具有display：none的元素上调用时，函数.outerWidth返回0。）
由jQuery UI Tabs和插件生成的HTML结构如下：
<ul class="ui-tabs-nav"> //Tabs as li elements </ul>
<ul class="ui-tabs-overflow"> //Tabs in dropdown </ul>
<div class="overflow-selector"/>
<div class="ui-widget-content" id="tabs-1" style="display: block;"> //Tab content - could contain tabs </div>
<div class="ui-widget-content" id="tabs-2" style="display: none;"> //Tab content </div>
<div class="ui-widget-content" id="tabs-3" style="display: none;"> //Tab content </div>
<div class="ui-widget-content" id="tabs-4" style="display: none;"> //Tab content </div>
或者，当单击选项卡时，插件将魔术应用于新显示的内容的解决方案也是可以接受的解决方案（但到目前为止，我还没有解决这个问题）。
任何帮助将不胜感激！ ：）