Question

我正在使用jQueryUI插件，我希望有几个引用相同div的选项卡（根据所选选项卡，其内容是动态的）。

当标签是静态的时，它可以工作，例如：

<div id="tabs">
<ul id="tab-links-container">
    <li class="tab-link">
        <a href="#main-tab">One</a>
    </li>     
    <li class="tab-link">
        <a href="#main-tab">Two</a>
    </li>
    <li class="tab-link">
        <a href="#main-tab">Three</a>
    </li>
</ul> 

<div class="tab-body" id="main-tab">
    <span>Here is the shared tabs content</span>
</div>

但是当我尝试动态添加标签时，我会遇到一些非常奇怪的行为。我是这样做的：

$("#tabs").tabs("add", "#main-tab", tabTitle);

奇怪的行为如下：

第一个标签似乎已被选中，但我看不到任何内容（目标div为空白）。
当点击第二个标签时，它会被选中，内容会显示，但第一个标签仍然显示为已选中，并且不是“可点击”。
只有在选择第三个标签时，整个机制才会排除，一切都恢复正常。

当我尝试使用其他错误时遇到的类似场景，例如标签内容（目标）被隐藏，甚至标签本身也会被突然删除。

这适用于IE7 / 8和Chrome。

有没有其他人也遇到过类似的问题？这是一个已知的bug还是我错过了什么？

谢谢，

jQueryUI - 动态添加具有相同目标的选项卡

0 个答案: