Question

首先，我不得不说我还没有尝试任何东西，因为我不知道该怎么做。我也搜索过，但我找不到任何解决方案。

我想从以下

用jquery重新订购DIV

<div id="wrapper">
   <div class="A1"></div>
   <div class="A2"></div>
   <div class="B1"></div>
   <div class="B2"></div>
...and so on...
</div>

到这个

<div id="wrapper">
    <div class="A1"></div>
    <div class="B1"></div>
    <div class="A2"></div>
    <div class="B2"></div>
...and so on...
</div>

有什么建议吗？

Answer 1

这是另一种方法，不增加索引

$('.A + .B').each(function() {
    $(this).insertBefore($(this).prev());
});

FIDDLE

Answer 2

以下是重新排序元素的一种方法：

var aIndex = 0;
$('.B').each(function() {
    $(this).insertAfter('.A:eq('+(aIndex++)+')');
});

<强> Demo of the above

这假设您在那里有相同数量的A和B。

Answer 3

Fiddle Demo

.after( function(index) )

$('.A').after(function (i) {
    return $('.B:eq(' + i + ')')
});

<小时/> 在我们拥有类.A的元素之前，将使用类B平衡所有元素。

Fiddle 2 more element with B class

Fiddle 2 more element with A class

Answer 4

这很简单：

$(function(){
    $('.wrapper .B').each(function(i,el){
        $(this).insertAfter('.wrapper .A:eq('+i+')');
    });
});

请参阅insertAfter和each的文档。

Answer 5

如果A和B elemnets的数量相等，则可以使用以下代码

$('document').ready(function(){    
    var aIndex = 0;    

    $('#wrapper .B').each(function(idx,element) {    
        $(this).insertAfter('.A:eq('+(idx)+')');
    });
});

如何使用jquery从a，a，b，b到a，b，a，b重新排序div？

5 个答案: