tbody中的tablesorter td-colspan

Question

我正在尝试使用 tablesorter-plugin 对我的表格进行排序，其中包含最后一个单元格跨越多个列的行。

在跨越列中，有一个内表，其中包含多个单元格和隐藏行。当对表头 1 对第 1 列的响应进行排序时，表头 2 对第 2 列的响应和表头 3 对跨列的响应和 textExtraction 对跨列进行排序。但是有更多的表头，它们应该在内表上排序，而不是在下一列上。

我在这里做了一个小例子：http://jsfiddle.net/frankmyhre/aoLgu7f9/

$('table').tablesorter({
    textExtraction: {
        1: function(node){ return $(node).find('.cell1').eq(0).text(); },
        2: function(node){ return $(node).find('.cell2').eq(0).text(); }
    }
});

为了简化它，这就是我想要获得的（从小提琴）：

“名称”标题对名称列（第 0 列）进行排序
“电话”标题通过查看 cell1-class 的第一次出现的值来对跨越列（第 1 列）进行排序
“Type”-header 通过查看 cell2-class 的第一次出现的值来对 spanning-column（第 1 列）进行排序

Answer 1

tablesorter 的 fork 已更新为使用 textExtraction 函数（如果设置），而不是在 duplicateSpan 选项设置为 false (docs) 时将单元格值设置为空字符串 - 但此更改目前仅在存储库的 master 分支中可用，并设置为与版本 2.25.8 一起发布。

所以，你可以这样做（demo，使用this file）：

$('table').tablesorter({
  debug: true,
  duplicateSpan: false,
  textExtraction: function(node, table, cellIndex) {
    if (cellIndex > 0) {
      // this works because cell1 and cell2 match the table
      // column zero-based index
      return $(node).find('.cell' + cellIndex).eq(0).text(); 
    }
    return node.textContent;
  }
});

注意：此方法使用textExtraction函数从第一个cell1或cell2中抓取数据，所以带有“home”的cell忽略了“club”和“office”的内容。如果要包含它，请按如下方式修改函数 (demo)：

$('table').tablesorter({
  duplicateSpan: false,
  textExtraction: function(node, table, cellIndex) {
    if (cellIndex > 0) {
      // this works because cell1 and cell2 match the table
      // column zero-based index
      var txt = '';
      $(node).find('.cell' + cellIndex).each(function(){
        txt += this.textContent + ' ';
      });
      return txt;
    }
    return node.textContent;
  }
});

注意 2：debug 选项在演示中为 true，因此您可以查看控制台并查看这两个功能的区别。