使用JQuery对表进行排序

时间:2015-08-11 20:46:56

标签: jquery sorting

我正在尝试使用JQuery对表进行排序,但是我更改了顺序,但它没有正确排序。

    tbody.find('tr').sort(function(a, b){
    console.info(getValue($(a)) + " > " + getValue($(b)), getValue($(a)) > getValue($(b)));
    if(asc){
        return getValue($(a)) > getValue($(b));
    } else {
        console.log('desc');
        return getValue($(a)) < getValue($(b));
    }
}).appendTo(tbody);

控制台日志的输出。

Sorting
VM9079:68 13 > 406 false
VM9079:68 13 > 5 true
VM9079:68 14 > 13 true
VM9079:68 151 > 13 true
VM9079:68 124 > 13 true
VM9079:68 116 > 13 true
VM9079:68 112 > 13 true
VM9079:68 98 > 13 true
VM9079:68 89 > 13 true
VM9079:68 85 > 13 true
VM9079:68 82 > 13 true
VM9079:68 88 > 13 true
VM9079:68 152 > 13 true
VM9079:68 51 > 13 true
VM9079:68 54 > 13 true
VM9079:68 68 > 13 true
VM9079:68 58 > 13 true
VM9079:68 68 > 13 true
VM9079:68 99 > 13 true
VM9079:68 49 > 13 true
VM9079:68 47 > 13 true
VM9079:68 50 > 13 true
VM9079:68 91 > 13 true
VM9079:68 41 > 13 true
3VM9079:68 42 > 13 true
VM9079:68 88 > 13 true
3VM9079:68 35 > 13 true
VM9079:68 70 > 13 true
VM9079:68 30 > 13 true
2VM9079:68 34 > 13 true
VM9079:68 11 > 13 false
VM9079:68 19 > 13 true
2VM9079:68 27 > 13 true
VM9079:68 13 > 13 false
VM9079:68 27 > 13 true
VM9079:68 26 > 13 true
VM9079:68 13 > 13 false
VM9079:68 34 > 13 true
VM9079:68 22 > 13 true
VM9079:68 15 > 13 true
VM9079:68 22 > 13 true
2VM9079:68 21 > 13 true
2VM9079:68 19 > 13 true
VM9079:68 15 > 13 true
2VM9079:68 18 > 13 true
VM9079:68 25 > 13 true
VM9079:68 18 > 13 true
VM9079:68 11 > 13 false
VM9079:68 14 > 13 true
VM9079:68 6 > 13 false
VM9079:68 9 > 13 false
VM9079:68 22 > 13 true
2VM9079:68 15 > 13 true
VM9079:68 22 > 406 false
VM9079:68 22 > 35 false
VM9079:68 15 > 22 false
VM9079:68 14 > 22 false
VM9079:68 34 > 22 true
VM9079:68 151 > 22 true
VM9079:68 124 > 22 true
VM9079:68 116 > 22 true
VM9079:68 112 > 22 true
VM9079:68 98 > 22 true
VM9079:68 89 > 22 true
VM9079:68 85 > 22 true
VM9079:68 82 > 22 true
VM9079:68 88 > 22 true
VM9079:68 152 > 22 true
VM9079:68 51 > 22 true
VM9079:68 54 > 22 true
VM9079:68 68 > 22 true
VM9079:68 58 > 22 true
VM9079:68 68 > 22 true
VM9079:68 99 > 22 true
VM9079:68 49 > 22 true
VM9079:68 47 > 22 true
VM9079:68 50 > 22 true
VM9079:68 91 > 22 true
VM9079:68 41 > 22 true
3VM9079:68 42 > 22 true
VM9079:68 88 > 22 true
VM9079:68 35 > 22 true
VM9079:68 15 > 22 false
VM9079:68 18 > 22 false
VM9079:68 25 > 22 true
VM9079:68 35 > 22 true
VM9079:68 70 > 22 true
VM9079:68 30 > 22 true
2VM9079:68 34 > 22 true
VM9079:68 14 > 22 false
2VM9079:68 18 > 22 false
VM9079:68 15 > 22 false
2VM9079:68 19 > 22 false
2VM9079:68 21 > 22 false
VM9079:68 22 > 22 false
VM9079:68 15 > 22 false
VM9079:68 22 > 22 false
3VM9079:68 27 > 22 true
VM9079:68 19 > 22 false
VM9079:68 26 > 22 true
VM9079:68 26 > 406 false
VM9079:68 26 > 47 false
VM9079:68 27 > 26 true
VM9079:68 151 > 26 true
VM9079:68 124 > 26 true
VM9079:68 116 > 26 true
VM9079:68 112 > 26 true
VM9079:68 98 > 26 true
VM9079:68 89 > 26 true
VM9079:68 85 > 26 true
VM9079:68 82 > 26 true
VM9079:68 88 > 26 true
VM9079:68 152 > 26 true
VM9079:68 51 > 26 true
VM9079:68 54 > 26 true
VM9079:68 68 > 26 true
VM9079:68 58 > 26 true
VM9079:68 68 > 26 true
VM9079:68 99 > 26 true
VM9079:68 49 > 26 true
VM9079:68 27 > 26 true
VM9079:68 50 > 26 true
VM9079:68 91 > 26 true
VM9079:68 41 > 26 true
3VM9079:68 42 > 26 true
VM9079:68 88 > 26 true
VM9079:68 35 > 26 true
VM9079:68 34 > 26 true
VM9079:68 35 > 26 true
VM9079:68 70 > 26 true
VM9079:68 30 > 26 true
2VM9079:68 34 > 26 true
VM9079:68 25 > 26 false
VM9079:68 27 > 26 true
VM9079:68 27 > 406 false
VM9079:68 27 > 49 false
VM9079:68 34 > 27 true
VM9079:68 151 > 27 true
VM9079:68 124 > 27 true
VM9079:68 116 > 27 true
VM9079:68 112 > 27 true
VM9079:68 98 > 27 true
VM9079:68 89 > 27 true
VM9079:68 85 > 27 true
VM9079:68 82 > 27 true
VM9079:68 88 > 27 true
VM9079:68 152 > 27 true
VM9079:68 51 > 27 true
VM9079:68 54 > 27 true
VM9079:68 68 > 27 true
VM9079:68 58 > 27 true
VM9079:68 68 > 27 true
VM9079:68 99 > 27 true
VM9079:68 27 > 27 false
VM9079:68 34 > 27 true
VM9079:68 27 > 27 false
VM9079:68 30 > 27 true
VM9079:68 50 > 27 true
VM9079:68 91 > 27 true
VM9079:68 41 > 27 true
3VM9079:68 42 > 27 true
VM9079:68 88 > 27 true
VM9079:68 35 > 27 true
VM9079:68 34 > 27 true
VM9079:68 35 > 27 true
VM9079:68 70 > 27 true
VM9079:68 30 > 406 false
VM9079:68 30 > 68 false
VM9079:68 35 > 30 true
VM9079:68 151 > 30 true
VM9079:68 124 > 30 true
VM9079:68 116 > 30 true
VM9079:68 112 > 30 true
VM9079:68 98 > 30 true
VM9079:68 89 > 30 true
VM9079:68 85 > 30 true
VM9079:68 82 > 30 true
VM9079:68 88 > 30 true
VM9079:68 152 > 30 true
VM9079:68 51 > 30 true
VM9079:68 54 > 30 true
VM9079:68 68 > 30 true
VM9079:68 58 > 30 true
VM9079:68 70 > 30 true
VM9079:68 99 > 30 true
2VM9079:68 34 > 30 true
VM9079:68 50 > 30 true
VM9079:68 91 > 30 true
VM9079:68 41 > 30 true
3VM9079:68 42 > 30 true
VM9079:68 88 > 30 true
VM9079:68 35 > 30 true
VM9079:68 34 > 30 true
VM9079:68 35 > 406 false
VM9079:68 35 > 58 false
VM9079:68 35 > 35 false
VM9079:68 88 > 35 true
VM9079:68 151 > 35 true
VM9079:68 124 > 35 true
VM9079:68 116 > 35 true
VM9079:68 112 > 35 true
VM9079:68 98 > 35 true
VM9079:68 89 > 35 true
VM9079:68 85 > 35 true
VM9079:68 82 > 35 true
VM9079:68 88 > 35 true
VM9079:68 152 > 35 true
VM9079:68 51 > 35 true
VM9079:68 54 > 35 true
VM9079:68 68 > 35 true
VM9079:68 34 > 35 false
VM9079:68 42 > 35 true
VM9079:68 70 > 35 true
VM9079:68 99 > 35 true
VM9079:68 34 > 35 false
VM9079:68 42 > 35 true
VM9079:68 34 > 35 false
VM9079:68 42 > 35 true
VM9079:68 50 > 35 true
VM9079:68 91 > 35 true
VM9079:68 41 > 35 true
VM9079:68 42 > 406 false
VM9079:68 42 > 51 false
VM9079:68 91 > 42 true
VM9079:68 151 > 42 true
VM9079:68 124 > 42 true
VM9079:68 116 > 42 true
VM9079:68 112 > 42 true
VM9079:68 98 > 42 true
VM9079:68 89 > 42 true
VM9079:68 85 > 42 true
VM9079:68 82 > 42 true
VM9079:68 88 > 42 true
VM9079:68 152 > 42 true
VM9079:68 41 > 42 false
VM9079:68 50 > 42 true
VM9079:68 54 > 42 true
VM9079:68 68 > 42 true
VM9079:68 88 > 42 true
VM9079:68 70 > 42 true
VM9079:68 99 > 42 true
2VM9079:68 42 > 42 false
VM9079:68 50 > 406 false
VM9079:68 50 > 82 false
VM9079:68 70 > 50 true
VM9079:68 151 > 50 true
VM9079:68 124 > 50 true
VM9079:68 116 > 50 true
VM9079:68 112 > 50 true
VM9079:68 98 > 50 true
VM9079:68 89 > 50 true
VM9079:68 85 > 50 true
VM9079:68 99 > 50 true
VM9079:68 88 > 50 true
VM9079:68 152 > 50 true
VM9079:68 91 > 50 true
VM9079:68 54 > 50 true
VM9079:68 68 > 50 true
VM9079:68 88 > 50 true
VM9079:68 70 > 406 false
VM9079:68 70 > 85 false
VM9079:68 68 > 70 false
VM9079:68 54 > 70 false
VM9079:68 91 > 70 true
VM9079:68 151 > 70 true
VM9079:68 124 > 70 true
VM9079:68 116 > 70 true
VM9079:68 112 > 70 true
VM9079:68 98 > 70 true
VM9079:68 89 > 70 true
VM9079:68 88 > 70 true
VM9079:68 99 > 70 true
VM9079:68 88 > 70 true
VM9079:68 152 > 70 true
VM9079:68 91 > 406 false
VM9079:68 91 > 98 false
VM9079:68 88 > 91 false
VM9079:68 99 > 91 true
VM9079:68 151 > 91 true
VM9079:68 124 > 91 true
VM9079:68 116 > 91 true
VM9079:68 112 > 91 true
VM9079:68 152 > 91 true
VM9079:68 89 > 91 false
VM9079:68 88 > 91 false
VM9079:68 99 > 152 false
VM9079:68 152 > 112 true
VM9079:68 99 > 112 false
VM9079:68 152 > 116 true
VM9079:68 112 > 116 false
VM9079:68 152 > 124 true
VM9079:68 116 > 124 false
VM9079:68 152 > 151 true
VM9079:68 124 > 151 false
VM9079:68 152 > 406 false

该种类的结果: enter image description here

1 个答案:

答案 0 :(得分:1)

你可以试试这个

<强> HTML

<table>
    <tbody>
        <tr>
            <td>10</td>
        </tr>
        <tr>
            <td>3</td>
        </tr>
        <tr>
            <td>1</td>
        </tr>
        <tr>
            <td>5</td>
        </tr>
    </tbody>
</table>

<强> JS

function getValue(row){
    // ordered by first column (0-based index)
    return parseFloat($($(row).find("td").get(0)).text());
}

var ordered = $("tbody").find('tr').toArray().sort(function(a, b){
    var asc = true;
    console.info(getValue(a) + " > " + getValue(b), getValue(a) > getValue(b));
    if(asc){
        return (getValue(a) == getValue(b))?0:((getValue(a) > getValue(b))?1:-1);
    } else {
        console.log('desc');
        return (getValue(a) == getValue(b))?0:((getValue(a) > getValue(b))?-1:1);
    }
});

// reset table content
$("tbody").html("");

$.each(ordered,function(){
    // append the ordered rows
    $(this).appendTo($("tbody"));
});

JSFiddle demo