添加几个jQueryUI选项卡

我在添加几个jquery ui选项卡时遇到问题。当前，单击

Field0

后，一些信息从

Field3

中消失，反之亦然

我想单击

Field0

或

Field1

并仅对这些字段应用更改<代码>字段3和

字段4不响应任何事件。
我使用document.on作为动态下载代码的一部分

我的代码：

您需要更改
$（“.pane div”）.hide（）
，以便只隐藏与选项卡关联的窗格的同级

你可以试试这个：

$(document).on("click", "ul.tabs a", function () {
    var $link = $(this),
        $pane = $($link.attr("href"));
    $link.removeClass('active').parent().addClass('active');
    $pane.show().siblings().hide();
    return false;
});

您需要更改
$（“.pane div”）.hide（）
，以便只隐藏与选项卡关联的窗格的同级

你可以试试这个：

$(document).on("click", "ul.tabs a", function () {
    var $link = $(this),
        $pane = $($link.attr("href"));
    $link.removeClass('active').parent().addClass('active');
    $pane.show().siblings().hide();
    return false;
});

这就是你要找的吗

我用我认为你想要的东西把它修好了一点。如果有帮助，请告诉我

我所做的是向每个div容器添加一个id属性，该属性将div标识为独立的存在。然后我只在单击来自的div上调用switch方法







字段0
字段1






字段2
字段3
$（文档）.ready（函数（）{
$（文档）。在（“单击”，“ul.a”，函数（）上）{
var whichPane=$（this.parents（）.eq（2.attr（'id'）；
$（“ul.tabs li”）.removeClass（“活动”）；
$（this.parent（）.addClass（'active'）；
var classname=$（this.attr（“类”）；
$（“#”+whichPane+“Pane div”）.hide（）；
$（$（this.attr（“href”）.show（）；
返回false；
});
})
这就是你要找的吗

我用我认为你想要的东西把它修好了一点。如果有帮助，请告诉我

我所做的是向每个div容器添加一个id属性，该属性将div标识为独立的存在。然后我只在单击来自的div上调用switch方法







字段0
字段1






字段2
字段3
$（文档）.ready（函数（）{
$（文档）。在（“单击”，“ul.a”，函数（）上）{
var whichPane=$（this.parents（）.eq（2.attr（'id'）；
$（“ul.tabs li”）.removeClass（“活动”）；
$（this.parent（）.addClass（'active'）；
var classname=$（this.attr（“类”）；
$（“#”+whichPane+“Pane div”）.hide（）；
$（$（this.attr（“href”）.show（）；
返回false；
});
})
尝试使第二组选项卡稍有不同，例如添加额外的类或类似的内容。尝试使第二组选项卡稍有不同，例如添加额外的类或类似的内容。
<div class="tabs" id="one">
<ul class="tabs">
<li><a href="#tab0_0">Field0</a></li>
<li><a href="#tab0_1">Field1</a></li>
</ul>
</div>
<div class="pane" id="onePane">
    <div id="tab0_0">Field 0</div>
    <div id="tab0_1">Field 1</div>
</div>

<br />

<div class="tabs" id="two">
    <ul class="tabs">
        <li><a href="#tab0_2">Field2</a></li>
        <li><a href="#tab0_3">Field3</a></li>
    </ul>
</div>
<div class="pane" id="twoPane">
    <div id="tab0_2">Field 2</div>
    <div id="tab0_3">Field 3</div>
</div>

$(document).ready(function() {
    $(document).on("click", "ul.tabs li a", function() {
        var whichPane = $(this).parents().eq(2).attr('id');
        $("ul.tabs li").removeClass('active');
        $(this).parent().addClass('active');
        var classname = $(this).attr("class");
        $("#" + whichPane + "Pane div").hide();
        $($(this).attr("href")).show();
        return false;
    });
    })