Question

我正在使用一个小用户来对表进行排序，但表的结构却非常奇怪。我想要做的是添加一个额外的排序功能，这样我就可以对人员的排名（＃）进行排序。

表数据如下所示：

<table id="outer">
    <tr>
        <td><div id="bgn"></div></td>
        <td><a href="#">User 1</a></td>
        <td>
            <table id="inner">
                <tbody>
                    <tr>
                        <td>Rank</td>
                        <td id="tdp">#28</td>
                    </tr>
                </tbody>
            </table>
        </td>
    </tr>
    <!-- more rows -->
</table>

还有一些额外的<td>，但它们现在并不重要。大约有52行，但当然可能会有所不同。

我当前的jQuery代码：

jQuery( document ).ready(function() {
    var rankings = [];

    $(document).on('click', '#tdr', function() {
    // skipping first line because it's the header

    $('tr:not(:first-child').each(function () {
        var rank = $(this).find('#tdp').text();
        var rank2 = rank.substring(1, rank.length)
        rankings.push(rank2);
    });

        console.log(rankings.sort(sortNumber));
    });

    function sortNumber(num1, num2) {
        return num1 - num2;
    }
});

JS Bin Example

控制台中的输出是一个包含所有排名的正确排序的数组，我只是不知道如何交换相应的<tr>＆＃39;以便表得到＆＃ 39;重建正确的道路。寻找任何提示或指针！

Answer 1

这个建议并没有真正进入＆＃34;排序＆＃34;行，但使用已排序的行重新构造表。但这应该做的工作：

rankings = rankings.sort(sortNumber);
var table = $('<table></table>');
for (var i = 0; i < rankings.length; i++) {
  var row = $('tr').filter(function() {
    var rank = $(this).find('#tdp').text();
    return rank.substring(1, rank.length) == i;
  });
  table.append(row);
}
$('#originalTable').html(table.html());

jQuery排序自定义表

JS Bin Example

1 个答案: