jQuery使用自定义顺序对HTML表进行排序

Question

我希望能够按月对表格进行排序。

示例：

February
December
October
August
July

排序时应该是

February
July
August
October 
December

我已经在线尝试了一些jQuery插件，但没有一个可以选择创建自定义排序顺序。

谢谢！

Answer 1

让我们想象为每个名为sort-order的表行添加一个属性。

现在，我们可以根据此属性订购表格：

$(function () {
  // sort the table rows
  var sortedTableRows = $('table tbody tr').get().sort(function (a, b) {
    var aVal = +a.getAttribute('sort-order');
    var bVal = +b.getAttribute('sort-order');
    return (aVal > bVal) ? 1 : (aVal < bVal) ? -1 : 0;
  });
  
  // substitute the table rows with the ordered one
  $.each(sortedTableRows, function (i, e) {
    $('table tbody').append(e);
  });
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<table>
    <thead>
    <th>
        <tr>
            <td>Months</td>
        </tr>
    </th>
    </thead>
    <tbody>
    <tr sort-order="12">
        <td>January</td>
    </tr>
    <tr sort-order="11">
        <td>February</td>
    </tr>
    <tr sort-order="10">
        <td>March</td>
    </tr>
    <tr sort-order="9">
        <td>April</td>
    </tr>
    <tr sort-order="8">
        <td>May</td>
    </tr>
    <tr sort-order="7">
        <td>June</td>
    </tr>
    <tr sort-order="6">
        <td>July</td>
    </tr>
    <tr sort-order="5">
        <td>August</td>
    </tr>
    <tr sort-order="4">
        <td>September</td>
    </tr>
    <tr sort-order="3">
        <td>October</td>
    </tr>
    <tr sort-order="2">
        <td>November</td>
    </tr>
    <tr sort-order="1">
        <td>December</td>
    </tr>
    </tbody>
</table>