使用JQuery Sorter插件对表中的图像和超链接列进行排序
我有一个包含3列的表，第一列包含服务名称，这是一个超链接，第二列包含状态图标，最后一列包含日志文件的图像，这也是一个超链接..
我想按第一列排序，这是一个超链接，因此排序应该在超链接的文本上进行，也应该在第二列上进行，这是一个基于下面给出的状态权重的状态图标：
Service Name Status Log Service 1 ![]()
Log1 Service 2 ![]()
Log Service 3 ![]()
Log
现在我想分别排序服务名称和状态的第一列和第二列。由于第一列包含链接和第二个图像，我想对它们进行排序..
我正在使用的代码在下面似乎没有工作..
jQuery(document).ready(function() { jQuery(".services").tablesorter({ // pass the headers argument and assing a object headers: { // assign the third column (we start counting zero) 2: { sorter: false } }, textExtraction: extractValue }); function extractValue(node){ var cell = node.childNodes[0]; console.log(cell.innerHTML); return cell.innerHTML; } });
任何帮助将受到高度赞赏。注意：我想按状态对状态进行排序，例如状态与其权重如下：
running =>1 stopped =>2 error =>3
看起来你需要使用专门的解析器和textExtraction的组合。 看看这个使用以下代码的演示 ：
// add parser through the tablesorter addParser method // running =>1 stopped =>2 error =>3 $.tablesorter.addParser({ // set a unique id id: 'status', is: function(s) { // return false so this parser is not auto detected return false; }, format: function(s) { // format your data for normalization return s.toLowerCase() .replace(/running.png/, 1) .replace(/stopped.png/, 2) .replace(/error.png/, 3); }, // set type, either numeric or text type: 'numeric' }); $('table').tablesorter({ headers: { 1: { sorter: 'status' } }, textExtraction: function(node) { var $n = $(node).children(); return ($n[0].nodeName === "IMG") ? $n.attr('src') : $n.text(); } });
我知道这可能有点快速和肮脏，但我有一个生成的页面服务器端。 检查例如（如果字段（’reg’）= 1，则显示ok.png，如果不显示not_ok.png）
所以我用图像写出数字，然后用数字排序。 我使用一种风格使数字1px，因此它不显示。
css：.mini {size：1px}`
HTML：
1
0
排序是好的，我没有必须摆弄JS。 您可以使用任何数字进行排序。