按包含标记的列对表格行进行排序

我使用tablesorter JQUery插件通过单击列来对HTML表格的行进行排序。在大多数情况下，表格单元格包含简单的标记，如<td>hello</td>，因此默认行为可以正常工作。按包含标记的列对表格行进行排序

但是，表中的一列包含这样

<td> 
    <a id="1" class="festivalSubscribe " action="create" 
    controller="festivalSubscription" onclick="/* Lots of Javascript */">Not Subscribed 
    </a> 

    <a id="1" class="festivalUnsubscribe hide" action="delete" 
    controller="festivalSubscription" onclick="/* Lots of JavaScript */">Subscribed 
    </a> 
</td>

此列中的每个单元包含两个链接的细胞（如上述），其中之一将始终是不可见的（一个与hide类）。我想按可见链接文本（“未订阅”或“订阅”）对此列进行排序。

该插件提供了选项来定义a function，其结果将用于确定如何对列进行排序，例如，

textExtraction: function(node) { 
    // extract data from markup and return it 
    return node.childNodes[0].childNodes[0].innerHTML; 
}

但是，我无法找到一个方法来定义这个函数，它将正确排序的简单情况<td>hello</td>和上述更复杂的情况。

来源

2012-01-11 Dónal

也许.innerText，所以你只能得到实际的文字内容而不是标签？ – 2012-01-11 15:28:41

我想要的是哪个链接的文本不是'hide'类的成员，但我不知道如何在JQuery中表达该内容 – 2012-01-11 15:38:34

但是，对于大多数现代浏览器，您可以使用'node.textContent'一些较旧的浏览器必须使用'node.innerText'。 – 2012-01-11 15:45:23

试试这个，它应该处理其子的两种情况元素和没有子元素：

textExtraction: function(node) { 
    // extract data from markup and return it 
    var $node_a = $(node).find("a"); 
    if ($node_a.length) { 
    return $node_a.filter(":visible").text(); 
    } 
    // normal case 
    return node.innerHTML; 
}

来源

2012-01-11 15:49:05

试试这个：

textExtraction: function(node) { 
    return $('td :not(.hide)', node).text(); 
}

来源

2012-01-11 15:43:17 Krzysztof

你可以抓住的节点内发现第一个可见的元素，并使用该从中提取文本：

$(node).find(':visible:eq(0)').text();

来源

2012-01-11 15:44:57

我觉得@Kevin B的答案是最好的ori ginal插件，但我想补充一点，我已将github上的原始插件的副本分叉并添加了textExtraction选项的功能以允许指定列。所以这是可能的。

$("table").tablesorter({ 

    // Define a custom text extraction function for each column 
    // default extraction is obtained like this: `$(node).text()` 
    textExtraction: { 
    0: function(node) { 
     return $(node).find("a:visible").text(); 
    } 
    } 
});

来源

2012-01-11 16:10:55 Mottie

这是一个不错的改进。我很惊讶这个功能在原版中没有。 – 2012-01-11 16:17:29

按包含标记的列对表格行进行排序

回答

相关问题