在动态排序时附加div

Question

我有一些通过Comet从服务器收到的Json数据，这些数据是块，每个块都有一个特定的ID，比方说：a，b，c和d。

这些块以随机顺序出现，因此块'a'实际上可以被接收到第二个，'d'等等......

这些块在格式化为HTML后会附加到容器中。我需要的是以下内容：无论这些块到达的顺序如何，我都需要按照ID的正确字母顺序将它们附加到容器中，这将导致以下div：

<div id="container">
   <div class="chunk" id="a">...</div>
   <div class="chunk" id="b">...</div>
   <div class="chunk" id="c">...</div>
   <div class="chunk" id="d">...</div>
</div>

解决方案是等待接收所有块然后以正确的顺序附加它们但是这打破了我的一个要求，一旦接收到块，就应该显示它。

在确保保留正确的订单时，有没有办法追加div？

Answer 1

您可以添加新内容，然后对元素进行排序

$.ajax({
    url : 'page.php'
}).done(function(chunk) {
    $('#container').append(chunk)

    $('#container .chunk').sort(function(a,b) {
        return a.id.localeCompare(b.id);
    }).appendTo('#container');
});