Question

我有一个带有儿童DIV的容器DIV，如：

<div class="parent">
    <div id="one" class="child"></div>
    <div id="two" class="child"></div>
    <div id="three" class="child"></div>
    <div id="four" class="child active"></div>
    <div id="five" class="child"></div>
</div>

我想要的是.active子DIV之前的所有子DIV都将被删除并将附加在底部，所以它现在看起来像这样：

<div class="parent">
    <div id="four" class="child active"></div>
    <div id="five" class="child"></div>
    <div id="one" class="child"></div>
    <div id="two" class="child"></div>
    <div id="three" class="child"></div>
</div>

我怎么能在jquery中做到这一点？

谢谢：）

Answer 1

像这样：

$('div:lt('+$('.active').index()+')', '.parent').appendTo('.parent');

FIDDLE

Answer 2

$('.active').nextAll().addBack().prependTo('.parent');

<强> jsFiddle example

没有克隆，没有字符串连接，也没有.each()

Answer 3

像这样 -

var $cloned = $('.parent .active').prevAll().clone().end().remove();
$('.parent').append($cloned.get().reverse());

演示----> http://jsfiddle.net/AqS4u/1/

Answer 4

如果有多个divs：

$('.parent').each(function() {
    $(this.firstChild).nextUntil('.active').appendTo(this);
});

DEMO

Answer 5

这应该这样做：

$('.active').prevAll().appendTo('.parent');

编辑实际上不是，但我会留下来给后人 - .prevAll()集合以相反的顺序返回，因此附加功能不正常。

删除活动元素之前的所有元素并追加到底部

5 个答案: