Question

我正在尝试从元素中删除一个类，并将该类添加到下一个元素中。问题是下一个元素被跳过。这是我的Javascript：

var $active = this.$view.find('.active');
if ($active.index() !== this.$view.children().length - 1) {
    $active.next('.list-group-item').addClass('active');
    $active.removeClass('active');
}

这是HTML：

 <div>
     <a class="list-group-item active">1</a>
     <a class="list-group-item active">2</a>
     <a class="list-group-item active">3</a>
     <a class="list-group-item active">4</a>
 </div>

Answer 1

$('.list-group-item').on('click',function(){
    debugger;
    var $active = $(this).parent().find('.active');
    if ($active.index() !== $(this).parent().children().length - 1) {
        $active.next('.list-group-item').addClass('active');
        $active.removeClass('active');
    }
});

.active{
    font-weight:bolder;
}

<div>
     <a class="list-group-item active">1</a>
     <a class="list-group-item ">2</a>
     <a class="list-group-item ">3</a>
     <a class="list-group-item ">4</a>
</div>

嗨，我认为你正在努力实现这一点，因为我理解你的代码

这里是jsfiddle

JSFIDDLE

第一个点

.active 类被赋予所有标签。
然后，当你找到标签的子元素时，你将永远不会得到它，因为它没有。

我已按照您预期的工作更正了您想要的代码

Answer 2

很难理解你的意图。但有些事情可能有所帮助：

最后$active.removeClass('active');从active指向的所有元素中删除$active类。这意味着$active.next('.list-group-item').addClass('active');行基本上没有意义。

next()方法会在$active中的第一个元素后立即搜索与选择器匹配的元素，因此 - 第一个元素将被跳过。如果您还想处理第一个元素，可以使用siblings()。

只要index()指向至少1个元素，$active方法将返回0，无论该集合的长度如何。你评价的条件在这方面似乎很奇怪。

.next（）jquery函数跳过下一个兄弟

2 个答案: