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小时内解决了这个问题后，我找到了自己的解决方案。我在这里发布。也许它可以帮助其他人。

特别感谢那些投票的人＃34;在没有帮助我的问题上。他们给了我找到自己解决方案的意志力。

    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值进行排序

2 个答案: