jQuery 工具选项卡：多个不同的实例

Question

使用jQuery Tools Tabs，我正在尝试使用.tabs() 的多次调用来实例化多个选项卡实例。

在官方文档中，他们有创建多个选项卡实例的示例（http://flowplayer.org/tools/demos/tabs/multiple.html）。然而，在这里，它本质上是相同选项卡/窗格设置的多个副本，外观、css 和 html（本质上）相同。

我当前的设置如下：

$("#tabs-1").tabs("#panes-1 > .pane-1");
$("#tabs-2").tabs("#panes-2 > .pane-2");

HTML：

<ul id="tabs-1">
  <li>tab 1</li>
  ...etc
</ul>

<div id="panes-1">
  <div class="pane-1">
     <ul id="tabs-2">
      <li>tab 1</li>
      ...etc
    </ul>
    <div id="panes-2">
      <div class="pane-2">Pane Content</div>
      ...etc
    </div>
  </div>
  ...etc (more .pane-1 panes)
</div>

我想要的是选项卡功能，用于两组不同的选项卡和窗格；它们的 DOM 位置和外观彼此不同，并且一个嵌套在另一个内部。

上面示例中的每个函数都可以单独运行。如果两者都被调用，则只有一个 Tabs 实例有效（以第一个调用者为准）而第二个无效。

我做错了什么？

Answer 1

尝试按照此页面上的演示进行操作： http://flowplayer.org/tools/demos/tabs/multiple-tabs.htm