0

我正在使用jquery UI tabs并想知道，是否可以指向一个 div 中不存在的 id

main tab div容器，是指

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">tab1</a></li>
        <li><a href="#tabs-2">tab2</a></li>
        <li><a href="#outerdiv">tab3</a></li>
    </ul>
    <div id="tabs-1">
        <p>Tab 1</p>
    </div>
    <div id="tabs-2">
        <p>Tab 2</p>
    </div>
</div>

<div id="outerdiv">
        <p>Tab 3</p>
    </div>

我试过了，但是当我点击tab3div#outer时内容没有打开。我怎样才能做到这一点？

4

2 回答 2

2

我相信默认的 jQuery 插件正在寻找$(this).find("#outerdiv")（where this= #tabs）你的元素不是。

有一些方法可以让这个工作，但我认为最好的办法是#outerdiv进入#tabs.

如果您坚持保持标记相同，则可以使用如下load方法：

$("#tabs").tabs({
 load: function (event, ui) {
    switch (ui.index) {
       case 2:
           $("#tabs div").hide();
           $("#outerdiv").show();
           break;
    }
}
});

但我不知道这将如何影响您的其他选项卡面板。您可能必须将它们全部添加到此开关功能中。

于 2012-06-15T15:14:42.807 回答
1

您可以在初始化选项卡之前移动divusing ：.appendTo()

$("#outerdiv").appendTo("#tabs");

这里的工作示例

于 2012-06-15T15:24:26.703 回答