带有多个选择器的jQuery .each() - 跳过,然后是.empty()元素

时间:2010-03-19 21:50:18

标签: jquery jquery-selectors each

我想删除所有匹配的元素,但跳过每个匹配的第一个实例:

// Works as expected: removes all but first instance of .a
jQuery ('.a', '#scope')
    .each ( function (i) { 
        if (i > 0) jQuery (this).empty();
    });

// Expected: removal of all but first instance of .a and .b
// Result: removal of *all* instances .a and .b
jQuery ('.a, .b', '#scope')
    .each ( function (i) { 
        if (i > 1) jQuery (this).empty();
    });

<div id="scope">

    <!-- Want to keep the first instance of .a and .b -->

    <div class="a">[bla]</div>
    <div class="b">[bla]</div>

    <!-- Want to remove all the others -->

    <div class="a">[bla]</div>
    <div class="b">[bla]</div>

    <div class="a">[bla]</div>
    <div class="b">[bla]</div>
    ...
</div>

有什么建议吗?

  • 由于与“遗留”代码冲突而使用jQuery()而不是$()
  • 使用.empty()因为.a包含JS我想禁用
  • 坚持使用jQuery 1.2.3

谢谢!

2 个答案:

答案 0 :(得分:3)

尝试一下:

$('.a:gt(0), .b:gt(0)').remove();

我不确定是否可以使用:gt()将它们合并到一个选择器中,它可能会在第一个.a之后更改范围并删除所有选择器。

答案 1 :(得分:1)

看起来您的HTML不正确。我将其修改为以下内容:

<div id="scope">

    <!-- Want to keep the first instance of .a and .b -->

    <div class="a">[bla]</div>
    <div class="b">[bla]</div>

    <!-- Want to remove all the others -->

    <div class="a">[bla]</div>
    <div class="b">[bla]</div>

    <div class="a">[bla]</div>
    <div class="b">[bla]</div>
    ...
</div>

然后这似乎有效:

jQuery('div#scope div.a').not(':first').empty();
jQuery('div#scope div.b').not(':first').empty();