jQuery的表格排序一旦

Question

我怎樣才能訂購像這樣的表：

Group pos 
b  2 
c  1 
b  1 
a  1 

這樣：

Group pos 
a  1 
b  1 
b  2 
c  1 

與jquery？

該表應該不是是可排序。

我只想對行排序一次，我想訂購兩列。

Answer 1

您可以使用sort()排序表

$('tbody tr').sort(function(a, b) { 
 
    var td1 = $(a).find('td'), 
 
    td2 = $(b).find('td'); 
 
    // condition for sort - compare with first column if they are equal then compare with second column 
 
    return (td1.eq(0).text() > td2.eq(0).text() || (td1.eq(0).text() == td2.eq(0).text() && td1.eq(1).text() > td2.eq(1).text())) || 0; 
 
}).appendTo('table tbody');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th> 
 
     Group</th> 
 
     <th>pos</th> 
 
     <tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td> 
 
     b 
 
     </td> 
 
     <td>2</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     c 
 
     </td> 
 
     <td>1</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     b 
 
     </td> 
 
     <td>1</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     a 
 
     </td> 
 
     <td>1</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

或者

$('tbody tr').sort(function(a, b) { 
 
    var td1 = $(a).find('td'), 
 
    td2 = $(b).find('td'); 
 
    // condition for sort - compare with first column if they are equal then compare with second column 
 
    if (td1.eq(0).text() > td2.eq(0).text() || (td1.eq(0).text() == td2.eq(0).text() && td1.eq(1).text() > td2.eq(1).text())) 
 
    return 1; 
 
    else if (td1.eq(0).text() < td2.eq(0).text() || (td1.eq(0).text() == td2.eq(0).text() && td1.eq(1).text() < td2.eq(1).text())) 
 
    return -1; 
 
    return 0; 
 
}).appendTo('table tbody');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table> 
 
    <thead> 
 
    <tr> 
 
     <th> 
 
     Group</th> 
 
     <th>pos</th> 
 
     <tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td> 
 
     b 
 
     </td> 
 
     <td>2</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     c 
 
     </td> 
 
     <td>1</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     b 
 
     </td> 
 
     <td>1</td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
     a 
 
     </td> 
 
     <td>1</td> 
 
    </tr> 
 
    </tbody> 
 
</table>