Question

如果之前有人问过，我道歉。我试图进行彻底的搜索，但我想可能会使用错误的术语。

无论如何。我有一些动态生成的数据，并通过一些XSLT魔法弹出到表中。我还想出了一种动态检查表中给定条目是否需要跨越两个或更多表格单元格的方法。

不幸的是，在colspan属性中运行是将表格单元格添加到表格的末尾。我有一个截图，但我没有足够的信誉发布图片。

我已经调查过几乎所有处理xslt的方法，并得出结论答案在于javascript / jquery。

我已经走到这一步了：

var ths = $('table.calendar > tbody > tr > th');
var tds = $('table.calendar > tbody > tr > td');
thLength = ths.length;
tdLength = tds.length;

//all good so far

if(tdLength > thLength) { //which it most certainly is
    //somehow delete the unwanted element(s) in the td array, like:
    for(var i = tdLength; i > thLength; i--) {
        $(tds[i]).remove();
    }
}

除非不起作用。并且，被授予，这可能是因为我是一个hacky编码器，充其量。

提前致谢。

Answer 1

您可以使用slice和remove，但您需要每行;你的$('table.calendar > tbody > tr > td');将为同一个jQuery对象中的多行提供单元格。

所以：

var ths = $('table.calendar > tbody > tr > th');
var thLength = ths.length;
$('table.calendar > tbody > tr').each(function() {
    var tds = $(this).children('td');
    tds.slice(thLength).remove();
});

当然，您可以在回调中组合这两行：

    $(this).children('td').slice(thLength).remove();

请注意，假设您只有一行th元素。（哪个应该在thead而不是tbody，FWIW。）

另请注意，这些都不会考虑colspan。如果你正在使用colspan，那么你不能只根据你所做的事情来确定有多少个单元格（因为单个单元格跨越了列）。

<强> slice

将匹配元素集减少到由一系列索引指定的子集。

采用start和end;如果你关闭end，它会转到集合的末尾。

直播示例：

setTimeout(function() {
  var ths = $('table.calendar > tbody > tr > th');
  var thLength = ths.length;
  $('table.calendar > tbody > tr').each(function() {
    var tds = $(this).children('td');
    tds.slice(thLength).remove();
  });
}, 500);

<p>Table will update after a brief delay.</p>
<table class="calendar">
  <tbody>
    <tr>
      <th>One</th>
      <th>Two</th>
      <th>Three</th>
      <th>Four</th>
    </tr>
    <tr>
      <td>1-1</td>
      <td>1-2</td>
      <td>1-3</td>
      <td>1-4</td>
      <td>1-5</td>
      <td>1-6</td>
      <td>1-7</td>
    </tr>
    <tr>
      <td>1-1</td>
      <td>1-2</td>
      <td>1-3</td>
      <td>1-4</td>
    </tr>
    <tr>
      <td>1-1</td>
      <td>1-2</td>
      <td>1-3</td>
      <td>1-4</td>
      <td>1-5</td>
    </tr>
    <tr>
      <td>1-1</td>
      <td>1-2</td>
      <td>1-3</td>
      <td>1-4</td>
      <td>1-5</td>
      <td>1-6</td>
    </tr>
  </tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

在javascript / jquery中删除幻像表单元格

1 个答案: