Question

我有这段代码：

<div id="main-container">
    <div class="comunicato-item">
        <div class="item item-1">Marco</div>
        <div class="item item-2">3</div>
        <div class="item item-2">2012</div>
    </div>

    <div class="comunicato-item">
        <div class="item item-1">Andrea</div>
        <div class="item item-2">2</div>
        <div class="item item-2">2013</div>
    </div>  

    <div class="comunicato-item">
        <div class="item item-1">Paul</div>
        <div class="item item-2">9</div>
        <div class="item item-2">2003</div>
    </div>  
</div>

我想根据（例如）comunicato-item元素值来订购.item.item-2项。所以结果应该是在排序之后：

<div id="main-container">
    <div class="comunicato-item row">
        <div class="item item-1">Andrea</div>
        <div class="item item-2">2</div>
        <div class="item item-2">2013</div>
    </div>  

    <div class="comunicato-item row">
        <div class="item item-1">Marco</div>
        <div class="item item-2">3</div>
        <div class="item item-2">2012</div>
    </div>

    <div class="comunicato-item row">
        <div class="item item-1">Paul</div>
        <div class="item item-2">9</div>
        <div class="item item-2">2003</div>
    </div>  
</div>

jquery可以吗？尝试过像这样的事：

var a = [];
$(".comunicato-item .item.item-2").each(function(i,e){
    a.push(e);
});
$.each(a.sort(),function(i,e){
    $("#"+e).appendTo('#main-container');
});

但它失败了！有什么想法吗？

Answer 1

你很接近，但是sort方法需要一个函数来评估这个实例中的数组...

var a = [];

$(".comunicato-item").each(function() {
    a.push(this);
});

a.sort(function(x, y) {
    var xval = parseInt($(".item-2:first", x).text(), 10);
    var yval = parseInt($(".item-2:first", y).text(), 10);
    if (xval > yval) return 1;
    else if (xval < yval) return -1;
    else return 0;
});

$.each(a, function() {
    $(this).appendTo('#main-container');
});

Answer 2

您可以使用.sort函数对此集合进行排序。因为jQuery已经将元素存储在数组中，所以无需循环并将其推入数组。也没有必要循环并附加元素

var x = $('#main-container > .comunicato-item').sort(function(a,b){
    var f = +$(a).find('.item-2:first').text();
    var s = +$(b).find('.item-2:first').text();
    return f-s; // no need for if/else because these are numbers
});
$('#main-container').html(x);
// or $('#main-container').append(x);
// or x.appendTo('#main-container');

http://jsfiddle.net/SuCyz/

修改

如果按字词排序，则必须使用if / else

var x = $('#comunicato-items > .comunicato-item').sort(function(a,b){ var f = $(a).find('.item-2:first').text(); var s = $(b).find('.item-2:first').text(); return f > s ? 1 : f < s ? -1 : 0; }); $('#comunicato-items').html(x);

，其中

f > s ? 1 : f < s ? -1 : 0;

等于

if(f > s){ return 1; }else if(f < s){ return -1; }else{ return 0; }

http://jsfiddle.net/u5Nxw/

如何根据内部元素的值来订购商品？

2 个答案: