对多个表的 td 值进行排序

Question

我需要对 3 个表的前 td 个元素进行排序。我一定要用jQuery做的不纯javascript。示例：

<table>
    <tr>
        <td>cx</td>
        <td>xx</td>
    </tr>
</table>
<table>
    <tr>
        <td>bx</td>
        <td>xx</td>
    </tr>
</table>
<table>
    <tr>
        <td>ax</td>
        <td>xx</td>
    </tr>
</table>

我想得到的结果是：

<table>
    <tr>
        <td>ax</td>
        <td>xx</td>
    </tr>
</table>
<table>
    <tr>
        <td>bx</td>
        <td>xx</td>
    </tr>
</table>
<table>
    <tr>
        <td>cx</td>
        <td>xx</td>
    </tr>
</table>

编辑 1：这就是我想要做的：如果你能告诉我如何获取当前的 td 元素值，那对我来说会很好

编辑 2：现在结果中的值与排序前相同。对不起我的错误

var table = $("table");
var currentTableTd;
$.each(table, function(k, v) {
  //currentTableTd = v.find("td:first-child");
  //window.console.log(currentTableTd); // will log error v.find() is not a function which I understand because var v isn't a Jquery object.
  //or
  currentTableTd = $(this).find("td:first-child").text();
  window.console.log(currentTableTd); //log undefined
})

Answer 1

你可以使用 sort，然后替换 html:-

var sorted = $('table').sort(function(a, b) {
  return $('td:first', a).text().localeCompare($('td:first', b).text());
}).clone();

sorted.each(function(i, e) {
  $('table').eq(i).html($(e).html());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>cx</td>
    <td>xx</td>
  </tr>
</table>
<table>
  <tr>
    <td>bx</td>
    <td>xx</td>
  </tr>
</table>
<table>
  <tr>
    <td>ax</td>
    <td>xx</td>
  </tr>
</table>

Answer 2

经过 24 小时的努力，我终于找到了自己的解决方案。我post就在这里。也许它可以帮助其他人。

特别感谢 "voted down" 回答我的问题但没有帮助我的人。他们给了我找到自己解决方案的意志力。

    var table = $("table");
    $.each(table, function (k, v) {
        var $currentTable = $("table").eq(k);
        var $tr = $currentTable.find("tr").not(":first");
        var $tdAll = $tr.find("td:first");
        var textNodes = []; //collecting textNodes of td elements 
        var map = {}; //mapping $tdAll
        var result = []; //contains sorted td elements to be added to the dom

        $.each($tdAll, function (k, v) {
            textNodes.push($(v).text());
            map[k] = $(v);
        })
        textNodes.sort();
        for (var i = 0; i < textNodes.length; i++) {
            for (var key in map) {
                if (textNodes[i] === $(map[key]).text())
                    result.push($(map[key]));
            }
        }
        //Dom construction
        $tr.find("td").remove();
        for (var i = 0; i < textNodes.length; i++) {
            $tr.eq(i).find("td:first").before($(result[i]));
        }
    })

对多个表的 td 值进行排序

Sort td values on multiple tables

javascript

jquery

jquery-selectors