1

我有这个代码：

<div class="m-item m-active">
</div>

<div class="m-item">
</div>

<div class="m-item">
</div>

我想要做的是当我单击一个按钮时，jquery 找到具有“m-active”类的“m-item”类的 div，从该 div 中删除“m-active”类并移动它到下一个“m-item”div。

所以点击按钮后，代码应该是这样的（其中 m-active 在第二个 div 上）：

<div class="m-item">
</div>

<div class="m-item m-active">
</div>

<div class="m-item">
</div>

有谁知道如何做到这一点？

谢谢你。

4

2 回答 2

2

一旦到达终点，此答案将处理环绕到第一个元素。如果没有任何元素处于活动状态，它也将起作用。

单击按钮时，找到活动元素，然后使用 jQuery next()函数找到下一个.m-item。如果未找到该项目 ( next.length === 0)，则获取第一个.m-item. 最后切换m-active类：

$('#get-next').on('click', function() {
    var active = $('.m-active');
    var next = active.next('.m-item');
    if(next.length === 0) {
         next = $('.m-item').eq(0);   
    }

    active.removeClass('m-active');
    next.addClass('m-active');    
});

工作演示

于 2013-07-17T16:51:42.677 回答
0 
$('.m-active').removeClass('m-active').next('.m-item').addClass('m-active');

进一步阅读：

next() , addClass() , removeClass()

于 2013-07-17T16:43:49.723 回答