Question

我有一个我要排序的无序列表。所有列表项都具有数据属性data-index及其对应的列表索引号。我想根据这个索引号来排序列表，但是，我想忽略具有类.active的列表项

因此，在我的以下结构中，我尝试按照data-index的顺序返回所有列表项之后的所有列表项。列表.active的列表项应该被忽略并保持最佳状态。

<ul>
    <li class="active" data-index="8">Item 8</li>
    <li class="inactive" data-index="6">Item 6</li>
    <li class="inactive" data-index="5">Item 5</li>
    <li class="inactive" data-index="3">Item 3</li>
    <li class="inactive" data-index="4">Item 4</li>
    <li class="inactive" data-index="2">Item 2</li>
    <li class="inactive" data-index="1">Item 1</li>
    <li class="inactive" data-index="7">Item 7</li>
    <li class="inactive" data-index="9">Item 9</li>
</ul>

我将如何做到这一点？

我已经包含了一个基本结构的jsfiddle。

http://jsfiddle.net/T9qQt/6/

任何帮助都将不胜感激。

Answer 1

$('#sortList').click(function(){
   $('ul .inactive').sort(function(a,b) {
     return $(a).data('index') > $(b).data('index');
}).appendTo('ul');
});

Fiddle

Answer 2

尝试

$('#sortList').click(function () {
   var $active  = $('.active');
    var els = $active.nextAll().sort(function(e1, e2){
        return +$(e1).data('index') - +$(e2).data('index');
    }).insertAfter($active);
});

演示：Fiddle

Answer 3

这可以胜任，

$('#sortList').click(function () {
    $("ul li.inactive").sort(function (a, b) {
        return +$(a).data('index') - +$(b).data('index');
    }).appendTo($("ul"));
});

Fiddle

Answer 4

<ul>
    <li class="inactive" data-index="8">Item 8</li>
    <li class="inactive" data-index="6">Item 6</li>
    <li class="inactive" data-index="5">Item 5</li>
    <li class="inactive" data-index="3">Item 3</li>
    <li class="inactive" data-index="4">Item 4</li>
    <li class="inactive" data-index="2">Item 2</li>
    <li class="inactive" data-index="1">Item 1</li>
    <li class="inactive" data-index="7">Item 7</li>
    <li class="inactive" data-index="9">Item 9</li>
</ul>

<button id="sortList">Sort this list</button>


$('#sortList').click(function(){
    $('.inactive').sort(function(x,y) {
        return $(x).data('index') - $(y).data('index');
    }).appendTo($('.inactive').parent());
});

Demo

如何按数据属性对列表进行排序，忽略某个类？

4 个答案:

Fiddle