0

我有两个非常简单html table 的数据，其中分布着一些数据，请参阅下面的代码这是我到目前为止所做的。我在这里卡住了，请帮帮我。

var x = 0,y=0;
$("table tr td").each(function(){
    if($(this).text() !== ""){
        alert($(this).text());
        y++;
    }
    x++;
});
alert(x);//indicates how many td's 
alert(y);//indicates how many td have values

现在，如果其中没有数据，我只想将每个 td 中的数据向上移动 td 。请点击下面的 Js FIDDLE 链接

JS FIDDLE 链接

4

1 回答 1

5

以相反的顺序（从下往上）循环遍历行。对于每个td有数据的，查看td前一行中对应索引处的 是否为空。如果是这样，请将内容移到该行中。您可以使用index或:eq选择器来访问前一行的td. 您需要多次传递来处理列中有多个空白的情况，但代码要简单得多。

更复杂的方法是当你找到一个空白时向前推进并洗牌整个列。我对它的样子很感兴趣，所以：

var rows = $("#xyz tr");
var row, n;

for (row = 0; row < rows.length - 1; ++row) {
  $(rows[row]).children().each(function(col) {
    var thisCell, cellBelow, text, foundText;

    foundText = true;
    thisCell = $(this);
    while (!thisCell.text() && foundText) {
      // This cell has no text, shuffle the column up
      foundText = false;
      for (n = row; n < rows.length - 1; ++n) {
        cellBelow = $($(rows[n + 1]).children()[col]);
        text = cellBelow.text();
        if (text) {
          foundText = true;
        }
        $($(rows[n]).children()[col]).text(text);
        cellBelow.text('');
      }
    }
  });
}

实例| 来源 （对不起，无法忍受jsFiddle——根据我的经验，速度慢而且有问题）

现在，这是相当低效的，并且做了一些 DOM 操作，但它确实有效。正因为如此，如果表格很大，我会很想走另一条路，也许在建立一个列数组数组后遍历表格，只向每列添加非空白单元格，然后完全替换表格基于这些新数据。

于 2013-03-15T09:55:20.760 回答