Question

人！我遇到了麻烦...

<ul>
    <li><div class="track">1</div></li>
    <li><div class="track">2</div></li>
    <li><div class="track">3</div></li>
</ul>

<div class="track active">4</div>

<ul>
    <li><div class="track">5</div></li>
    <li><div class="track">6</div></li>
    <li><div class="track">7</div></li>
</ul>

如何在具有类跟踪和活动的元素之后在ALL文档中选择具有类轨道的下一个元素？

这是我尝试的jQuery，但它不起作用。

$('.active').nextAll('.track').first(); $('.track.active').nextAll('.track').first();

Answer 1

我认为这应该有效。 Fiddle

$(function () {
        var n = $(".active").index(".track"),
            next = $(".track").eq(n+1);
    next.css({"color":"red"});
});

首先获取活动类的索引，该索引也具有类轨道。然后做那个+1，你就得到了你需要的元素的索引。

虽然chrona的解决方案也是合法的，但我认为它在这里需要太多的资源（循环）。

Answer 2

遍历所有.track并检查它是否也是.active，然后将结果存储在var中并检查它：

var active = false;

$('.track').each(function(){
    var obj = $(this);

    if (active === true) {
        obj.css('background-color', 'red');
        active = false;
    }

    if (obj.hasClass('active')) {
       active = true;
    }
});

DEMO

@Bram Vanroy的答案要容易得多，不需要循环，你应该使用他的。

Answer 3

这很棘手，但您可以尝试：

var tracks    = $('.track');
var nextTrack = tracks[tracks.index(tracks.filter('.active')) + 1];

Answer 4

    $('.track').each(function(){

       if ($('.track').hasClass('active') == true) {
            $(this).next();//Do ...
        }
    });

接下来是jQuery选择器

4 个答案: