Question

我遇到的问题是我需要将某些div组合在一起并对它们进行重新排序，如果它全部是动画的，那就太酷了。请参阅以下内容：

<div id="away">Some Content</div>
<div id="online">Some Content</div>
<div id="offline">Some Content</div>
<div id="away">Some Content</div>
<div id="online">Some Content</div>
<div id="offline">Some Content</div>
<div id="online">Some Content</div>
<div id="online">Some Content</div>
<div id="away">Some Content</div>

所以我更需要通过以下方式将ID组合在一起： 1.online 2.away 3.offline

所以：

<div id="online">Some Content</div>
<div id="online">Some Content</div>
<div id="online">Some Content</div>
<div id="online">Some Content</div>
<div id="away">Some Content</div>
<div id="away">Some Content</div>
<div id="away">Some Content</div>
<div id="offline">Some Content</div>
<div id="offline">Some Content</div>

我似乎无法理解这一个=（。

我在网站的其余部分使用Jquery。

任何想法=），干杯，山姆T

Answer 1

首先，让我们摆脱这些ID（ID必须是唯一的！），并使用有效HTML的类，如下所示：

<div id="users">
  <div class="away">Some Content</div>
  <div class="online">Some Content</div>
  <div class="offline">Some Content</div>
  <div class="away">Some Content</div>
  <div class="online">Some Content</div>
  <div class="offline">Some Content</div>
  <div class="online">Some Content</div>
  <div class="online">Some Content</div>
  <div class="away">Some Content</div>
</div>

然后你可以使用.appendTo()轻松地对它们进行排序，如下所示：

var statusOrder = ["online", "away", "offline"];
for(var i=0; i<statusOrder.length; i++) {
    $("#users ." + statusOrder[i]).appendTo("#users");
}

You can give it a try here，这假设一个简单的容器，如<div id="users"></div>包裹着这个内容......只需使用它们所在的任何容器的选择器。

Jquery Div排序和顺序=）

1 个答案: