Question

我有下一个简单的表，我使用jQuery tablesorter按列排序：

<table class="tablesorter" id="tableinvoices">
    <thead>
        <tr>
            <th>Name</th>
            <th>LastName</th>
            <th>Age</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><b id="n1">Sonia</b></td>
            <td><b id="l1">Soto</b></td>
            <td><b id="a1">20</b></td>
        </tr>
        <tr>
            <td><b id="n2">Carlos</b></td>
            <td><b id="l2">Rodriguez</b></td>
            <td><b id="a2">21</b></td>
        </tr>
        <tr>
            <td><b id="n3">Borja</td>
            <td><b id="l3">Valera</td>
            <td><b id="a3">21</td>
        </tr>
    </tbody>
</table>

如果我点击名称，而不是按照td的值排序，请按ID排序。

如何按值排序？

感谢您的帮助，抱歉我的英语不好。

Answer 1

我假设你正在使用this jQuery tablesorter。

var myTextExtraction = function(node)  
{   
    return node.id; 
} 
$(document).ready(function() 
    { 
        $("#tableinvoices").tableSorter( {textExtraction: myTextExtraction} ); 
    } 
);

Answer 2

这是一个解决方案：http://jsfiddle.net/shtrih/Mh75v/

$(document).ready(function() { 
    // call the tablesorter plugin 
    $("table").tablesorter({ 
        // define a custom text extraction function 
        textExtraction: function(node) { 
            // extract data from id and return it 

            console.log(node.childNodes[0].innerHTML); // Make sure the output values
            return node.childNodes[0].innerHTML; 
        } 
    }); 
});

我使用过这个例子：http://tablesorter.com/docs/example-option-text-extraction.html

Answer 3

一种方法 - 在每个tds上添加一个隐藏列（style="display:none"应该可以解决问题。）。将您要排序的ID作为隐藏列的内容排序，而不是将它们作为ID添加到其他位置。设置tablesorter，以便隐藏列可排序，但Name列不可排序。然后在名称列的顶部添加一个jquery onclick侦听器，该列将单击隐藏列的顶部。这有点像kludge，但它应该给你你需要的东西。

Answer 4

试试这个textExtraction函数（demo）：

$(function () {
    $("#tableinvoices").tablesorter({
        textExtraction: function (node) {
            return $(node).find('b').attr('id');
        }
    });
});

但是，这个textExtraction函数假设每个表格单元都有一个ID。

jQuery Tablesorter命令由td id而不是td值

4 个答案: