jQuery：将Prev和Next添加到选项卡

我正在尝试将上一个和下一个功能添加到我的“选项卡”中，但有些功能不起作用

以下是html：

<a href="#" class="next-tab">next</a>
<a href="#" class="prev-tab">prev</a>

<div class="tabs">

<a href="#" class="tab new-messages">
<a href="#" class="tab statistics active">
<a href="#" class="tab shop">

</div>

---

您的

.tab

和

.active

元素在DOM的同一级别是相同的（链接），因此

parent（）

和

find（）

在这里没有用处，因为它们在DOM树上下查找

您只需获取当前的

.active

选项卡，使用

prev（）

或

next（）

获取它旁边的元素，然后在找到一个类时交换这些类：

jQuery（文档）.ready（函数（$）{
$（'.next tab'）。单击（函数（）{
//获取当前选项卡
var currentTab=$（“.tab.active”）；
//如果有下一个选项卡，则获取下一个选项卡（即，我们不在末尾）
var newTab=currentTab.next（）；
如果（新选项卡长度>0）{
//从旧选项卡中删除活动选项卡
currentTab.removeClass（“活动”）；
//将活动添加到新选项卡
newTab.addClass（“活动”）；
}
});
$（'.prev选项卡'）。单击（函数（）{
var currentTab=$（“.tab.active”）；
var newTab=currentTab.prev（）；
如果（新选项卡长度>0）{
currentTab.removeClass（“活动”）；
newTab.addClass（“活动”）；
}
});
});
.active{
边框：1px实心#000；
}
Hi@Rhumborl谢谢。我们如何改进这段代码，以便当我们点击“下一步”或“上一步”时，它将继续循环（循环）？
jQuery(document).ready(function($) {
    $('.next-tab').click(function () {
     if( $('.tab').hasClass("active")) {
       var tab = $('.tab').find("a.active");
       $(tab).parent().next().children().addClass("active");
       $(tab).removeClass("active");
       }
    });
});