Question

我正在使用jQuery tablesorter插件，我有一个包含月份和年份名称的列

April, 1975
January, 2001

我想将此列排序为日期列。据我了解，可以使用其他一些“隐藏”值对列进行排序，但我似乎无法找到该功能的文档。有任何帮助吗？

更新

这个tableorter的fork http://mottie.github.com/tablesorter/docs/index.html正是我所需要的;能够存储值以在属性中排序，工作得非常好。

Answer 1

只需使用textExtraction函数。在TD上设置数据排序值。如果不存在，则默认为普通文本。

$(".sort-table").tablesorter({
    textExtraction: function(node) {
        var attr = $(node).attr('data-sort-value');
        if (typeof attr !== 'undefined' && attr !== false) {
            return attr;
        }
        return $(node).text(); 
    } 
});

Answer 2

我有一个tablesorter的分支，允许您从表格单元格中编写一个可以extract data attributes的解析器，并分配特定的textExtraction for each column。

$(function(){

  $.tablesorter.addParser({ 
    // set a unique id 
    id: 'myParser', 
    is: function(s) { 
      // return false so this parser is not auto detected 
      return false; 
    }, 
    format: function(s, table, cell, cellIndex) { 
      // get data attributes from $(cell).attr('data-something');
      // check specific column using cellIndex
      return $(cell).attr('data-something');
    }, 
    // set type, either numeric or text 
    type: 'text' 
  }); 

  $('table').tablesorter({ 
    headers : { 
      0 : { sorter: 'myParser' }
    }
  });

});

Answer 3

为回答一个旧问题道歉，但现在这是一个标准特征的tablesorter ，虽然它由于某种原因没有记录。如果您打开文件https://github.com/christianbach/tablesorter/blob/master/jquery.tablesorter.js并查看第307行，您会看到它支持“data-sort-value”属性。

用法：

<td data-sort-value="42">Answer to the question</td>

Answer 4

这有点像黑客攻击（好吧，这是一个彻头彻尾的黑客攻击），但如果你将列的解析器设置为'text'，并使用你想要在其中排序的字符串预先修复你的漂亮输出隐藏的跨度将正确排序。

您可以使用headers选项在列上设置解析器，例如要将第一列和第二列上的解析器设置为“text”，您需要设置以下内容：

headers: {0: {sorter: 'text'}, : {sorter: 'text'}

要使用日期执行此操作，您可以使用按词法排序的ISO8601日期格式。 JS的Date个对象可以通过toISOString()函数生成ISO8601日期字符串。

鉴于CSS：

span.hidden{
    display:none;
}

表格中的示例单元格如下所示：

<td><span class="hidden">2015-04-18T23:48:33</span>19 April 2015</td>

这不是世界上最漂亮的代码，但确实有效。

Answer 5

您需要write your own parser。您的解析器可能最终看起来像：

var months = {'January':1,'February':2, ...};
$.tablesorter.addParser({
    id: 'myDate', 
    is: function(s) { return false; }, 
    format: function(s) {
        var x = s.split(', ');
        return x[1]+'-'+months[x[2]];
    },
    type: 'numeric' 
});

未经测试，但总体思路。

Answer 6

我正在使用

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.29.0/js/jquery.tablesorter.min.js"></script>

使用数据文本

工作

<td data-text="42">Answer to the question</td>

使用data-sort-value

无法正常工作

<td data-sort-value="42">Answer to the question</td>

jQuery tablesorter插件辅助“隐藏”排序

6 个答案: