Javascript jQuery，使用子元素中的数字对表中的行进行排序

我需要使用锚点（某些行中不存在的锚点）中的数字对表中的行进行排序。表示例：

<table id="sortedtable" class="full">
    <tbody>
        <tr>
            <th>Main tr</th>
        </tr>
        <tr>
            <td>
                <div style="float: left;">Title</div>
                <a class="unreadcount" href="#">7</a>
            </td>
        </tr>
        <tr>
            <td>
                <div style="float: left;">No anchor here :(</div>
            </td>
        </tr>
        <tr>
            <td>
                <div style="float: left;">Javascripthatesme</div>
                <a class="unreadcount" href="#">15</a>
            </td>
        </tr>
        <tr>
            <td>
                <div style="float: left;">Yourox</div>
                <a class="unreadcount" href="#">2</a>
            </td>
        </tr>
        <tr>
            <td>
                <div style="float: left;">This has more than one word and no anchor</div>
            </td>
        </tr>
        <tr>
            <td>
                <div style="float: left;">Title</div>
                <a class="unreadcount" href="#">11</a>
            </td>
        </tr>
        <tr>
            <td>
                <div style="float: left;">Big Bang Theory is not funny</div>
                <a class="unreadcount" href="#">4</a>
            </td>
        </tr>   
    </tbody>
</table>

主tr
标题
这里没有锚：(
Javascripthatesme
你的牛
这个词不止一个，而且没有锚
标题
大爆炸理论并不好笑

使用中的解决方案，我能够生成一个半工作代码：

var $table = $('table');

var rows = $table.find('tr').get();
rows.sort(function(a, b) {
    var keyA = $(a).find('a.unreadcount').text();
    var keyB = $(b).find('a.unreadcount').text();
    if (keyA < keyB) return 1;
    if (keyA > keyB) return -1;
    return 0;
});
$.each(rows, function(index, row) {
    $table.children('tbody').append(row);
});

var$table=$（'table'）；
var rows=$table.find（'tr'）.get（）；
行排序（函数（a，b）{
var keyA=$（a）.find（'a.unreadcount'）.text（）；
var keyB=$（b）.find（'a.unreadcount'）.text（）；
if（keyAkeyB）返回-1；
返回0；
});
$.each（行，函数（索引，行）{
$table.children（'tbody'）。追加（行）；
});

您可以看到它在中工作。问题和我需要帮助的地方是数字的排序方式（例如，8比32或12先出现），我需要忽略第一行（其中“Main tr”是），并将其始终保留在顶部

另外，如果你能给我一个指示，让我做一个按钮，让桌子重新回到原来的顺序，那就太棒了

---

谢谢。

您需要将文本值转换为数字，以便进行正确的数字排序。转换的简单方法是使用

要保留标题行，只需在排序的数组中不包含标题行，使用jQuery的

要添加一个按钮将表恢复到其原始顺序，只需在排序之前保留数组的一个副本，这是我用标准方法完成的

因此：

var$table=$（'table'）；
var originalRows=$table.find（'tr'）.slice（1.get（），
行=原始行。切片（0）；
行排序（函数（a，b）{
var keyA=+$（a）.find（'a.unreadcount'）.text（）；
var keyB=+$（b）.find（'a.unreadcount'）.text（）；
if（keyAkeyB）返回-1；
返回0；
});
$.each（行，函数（索引，行）{
$table.children（'tbody'）。追加（行）；
});
//将其更改回的按钮：
$（“输入”）。单击（函数（）{
$.each（原始行，函数（索引，行）{
$table.children（'tbody'）。追加（行）；
});
});
​

演示：

var $table = $('table');

var originalRows = $table.find('tr').slice(1).get(),
    rows = originalRows.slice(0);
rows.sort(function(a, b) {
    var keyA = +$(a).find('a.unreadcount').text();
    var keyB = +$(b).find('a.unreadcount').text();
    if (keyA < keyB) return 1;
    if (keyA > keyB) return -1;
    return 0;
});
$.each(rows, function(index, row) {
    $table.children('tbody').append(row);
});

// button that changes it back:
$("input").click(function(){
    $.each(originalRows, function(index, row) {
       $table.children('tbody').append(row);
    });
});
​