0

我想将 css 类添加到当前选定的选项卡内容中,因此当我单击下一个按钮时,应更改当前选定选项卡内容的 css。

我已经尝试了以下代码,但它不起作用:

 $("#tab-div").tabs();

    $(".next-tab").click(function () {

        var selected = $("#tab-div").tabs("option","selected");
        $("#tab-div").tabs("option", "selected", selected + 1);
        $(this).parent().removeClass("current");
        $(this).find("a").addClass("current");
        $(this).addClass("current");
     });

    $(".prev-tab").click(function () {
        var selected = $("#tab-div").tabs("option", "selected");
        $("#tab-div").tabs("option", "selected", selected - 1);
        $(this).parent().removeClass("current");
        $(this).find("a").addClass("current");
        $(this).addClass("current");

    });

HTML

<div class="prev-tab">
<a href="#" title="Previous">&nbsp;</a>
</div>
<div class="next-tab">
<a href="#" title="next">&nbsp;</a>
</div>    




 <div id="tab-div">
<ul class="nav">
<li><a href="#tab1" class="current">New Group</a></li>
<li><a href="#tab2">For Companies</a></li>
</ul>
<div id="tab1" class="current">
</div>
 <div id="tab2">
</div>     

谢谢,

4

1 回答 1

0

编辑:没关系,自从我发布以来,你改变了你的 html。这似乎是设置标签的一种糟糕的方式——我会考虑完全重新考虑。您应该设置一个处理所有这些的选项卡类,包括隐藏/显示选项卡内容 div 和设置/删除选定/当前类。

$(".next-tab, .next-tab").on('click', function() {
    $('#tab-div a').removeClass("current");
    $(this).find("a").addClass("current");
 });

会将当前类更改为您单击的任何内容。不过,这似乎不是设置选项卡的好方法,而且我也不确定 .tabs() 方法而不知道更多。

于 2012-05-02T06:06:01.933 回答