Question

我想将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>

谢谢，

Answer 1

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

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

会将当前类更改为您单击的任何内容。这似乎不是设置标签的好方法，而且我也不确定.tabs（）方法而不知道更多。

将css类添加到下一个和上一个选项卡jquery选项卡中的选定选项卡

1 个答案: