Question

我有两个非常简单的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 link

Answer 1

以相反的顺序循环遍历行（从下往上）。对于包含数据的每个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('');
      }
    }
  });
}

Live Example | Source （抱歉，不能站立 jsFiddle - 根据我的经验，缓慢而且有毛病）

现在，这种效率相当低，并且可以完成大量的DOM操作，但它确实有效。因此，如果表格很大，我会想要采取另一种方式，也许在构建一个列数组阵列后，遍历表格，只向每列添加非空白单元格，然后完全替换表格基于这些新数据。

如果td为空，如何将td中的表数据向上移动td

1 个答案: