如何将nextUntil与子选择器一起使用?

时间:2013-01-18 17:22:27

标签: jquery

鉴于此标记:

<ul>
    <li><a class="level1 selected">1</a></li>
    <li><a class="level2">2</a></li>
    <li><a class="level2">3</a></li>
    <li><a class="level2">4</a></li>
    <li><a class="level1">1</a></li>
    <li><a class="level2">5</a></li>
    <li><a class="level2">6</a></li>
    <li><a class="level2">7</a></li>
    <li><a class="level1">1</a></li>
</ul>

如何选择其{child}拥有类LI的{​​{1}}代码紧跟在其子级为level2的{​​{1}}代码后?{/ p>

我的初始代码失败,因为我无法正确使用nextUntil()函数。

LI

2 个答案:

答案 0 :(得分:3)

$lvl1 = $('a:not(.level2)').closest('li');
$lvl2 = $('a.selected').closest('li').nextUntil($lvl1);

或单行:

$lvl2 = $('a.selected').closest('li').nextUntil($('a:not(.level2)').closest('li'));

http://jsfiddle.net/mblase75/jKCrH/

答案 1 :(得分:1)

您可以为此创建自定义函数,而不是使用复杂的选择器(它将遍历jQuery中的太多对象)。我认为这会更有效率。试试DEMO HERE

$.fn.nextTillList1 = function () {
    return this.each(function () {
        var $item = $(this).next("li");
        while($item.find(".level1").length <= 0) {
            $item.children().addClass("on");
            $item = $item.next("li");
        }
    });
};

// Selects the parent of the select A tag    
var selectedParent = $("ul li a.selected.level1").parents("li");

// Call custom function
selectedParent.nextTillList1();