Question

我的列表无序。

<ul>
    <li class="foo">Baz</li>
    <li>Select Me!</li>
    <li>Select Me!</li>
    <li>Select Me!</li>
    <li class="bar">Baz</li>
    <li>Don't Select Me</li>
    <li>Red Herring List Item</li>
</ul>

如何使用jQuery在类foo和bar的列表项之间选择列表项？我不知道任何列表项的内容。我也不知道有多少列表项被选中，所以我不能依赖计数。

Answer 1

$('li.foo').nextUntil('li.bar')

http://jsfiddle.net/zZRDB/1/

Answer 2

var $elements = $('.bar').prevUntil('.foo');

或者另一种方式：

var $elements = $('.foo').nextUntil('.bar');

Demo

如果您有兴趣知道它是如何实施的，check out the source code：

nextUntil: function(elem, i, until) {
    return jQuery.dir(elem, "nextSibling", until);
},
prevUntil: function(elem, i, until) {
    return jQuery.dir(elem, "previousSibling", until);
},

dir: function(elem, dir, until) {
    var matched = [],
        cur = elem[dir];

    while (cur && cur.nodeType !== 9 && (until === undefined || cur.nodeType !== 1 || !jQuery(cur).is(until))) {
        if (cur.nodeType === 1) {
            matched.push(cur);
        }
        cur = cur[dir];
    }
    return matched;
},

Answer 3

尝试，

 $('li.bar').prevUntil('.foo')

DEMO

Answer 4

var index1 = $('li.foo').index(),
    index2 = $('li.bar').index()-1;

    $('li:gt('+ index1+'):lt('+ index2+')', 'ul');

或$('li.foo').nextUntil('li.bar');

或$('li.bar').prevUntil('li.foo');

在jQuery中，如何在具有某些类的元素之间选择元素？

4 个答案: