从不同的DIV排序元素

dhp*_*tik 5 html sorting jquery

我有3个div列,如下所示

<div class="col col-4 clist">
 <div data-seq="3">3</div>
 <div data-seq="5">5</div>
 <div data-seq="9">9</div>
</div>
<div class="col col-4 clist">
 <div data-seq="8">8</div>
 <div data-seq="7">7</div>
 <div data-seq="1">1</div>
</div>
<div class="col col-4 clist">
 <div data-seq="4">4</div>
 <div data-seq="2">2</div>
 <div data-seq="6">6</div>
</div>
Run Code Online (Sandbox Code Playgroud)

我想按升序排列这个内部div 1 2 3 4 5 6 7 8 9.如果它全部被排序并显示在一个div中和/或显示在3个不同的div中并不重要.出于同样的目的,我使用http://jsfiddle.net/f5mC9/下面写的js

var contacts = $('div.clist'), cont = contacts.children('div');

cont.detach().sort(function(a, b) {
            var astts = $(a).data('seq');
            var bstts = $(b).data('seq')
            //return astts - bstts;
            return (astts > bstts) ? (astts > bstts) ? 1 : 0 : -1;
        });

contacts.append(cont);
Run Code Online (Sandbox Code Playgroud)

我无法对来自不同div的元素进行排序.如果所有元素都在单个div中,则代码可以正常工作.

请帮帮我.

并提前衷心感谢.

Ror*_*san 4

您需要.clist使用循环遍历每个元素并对其中的each()子元素进行排序。div像这样的东西:

$('div.clist').each(function () {
    var $cont = $(this).children('div').sort(function (a, b) {
        return ($(a).data('seq') > $(b).data('seq')) ? 1 : -1;
    });
    $(this).append($cont);
});
Run Code Online (Sandbox Code Playgroud)

小提琴示例

  • @dhpratik 这就是你所要求的,不是吗?如果这不是您需要的内容,您能否编辑您的 OP 并提供更多您需要的详细信息。 (3认同)