javascript - Tablesorter 解析器忽略 div 元素

Question

我的网页上有一些表格，我使用表格排序器扩展来允许排序。除了一张 table 之外，一切正常。这个特定的表包含一个数值，但也包含一个 div 元素。问题是，由于存在 div，表排序器将其视为文本，例如“1000”被排序为低于“999”，因为它只识别初始的 1 和 9。

我已阅读文档并尝试基于它实现自定义解析器 - http://tablesorter.com/docs/example-parsers.html

不幸的是，它不起作用。基本上我想要实现的目标 - 单元格总是包含一个数字，后跟“......”等，所以我试图过滤掉初始“<”符号前面的值。但由于某种原因它只是忽略了解析器。

很难正确解释，所以我创建了一个jsfiddle。请忽略其余的设计、图像等。它在我的页面上看起来有所不同，但问题就在那里。

例如，查看“Total”列，其中有大于 1000 的数字，但它被排序为低于 100 以上的数字(它显然被视为文本)。通过单击表格标题来初始化排序。

任何帮助表示赞赏。 http://jsfiddle.net/8v8ycb09/

解析器代码:

$.tablesorter.addParser({ 
    // set a unique id 
    id: 'main', 
    is: function(s) { 
        // return false so this parser is not auto detected 
        return false; 
    }, 
    format: function(s) { 
        // format your data for normalization 
        return s.substr(0, s.indexOf('<')); 
    }, 
    // set type, either numeric or text 
    type: 'numeric' 
}); 

Answer 1

如果我理解正确的话，您只需要从格式函数中返回parseInt(s)。

parseInt() 忽略初始空格和前导数字字符串之后的任何内容。

format: function (s) {
    // format your data for normalization 
    return parseInt(s);
},

并将自定义排序器应用到列，如下所示:

$(function () {
    var sMap = {sorter:'main'};
    $("#rTable").tablesorter({
        headers: {
            2: sMap,
            3: sMap,
            4: sMap,
            5: sMap,
            6: sMap,
            7: sMap,
            8: sMap,
            9: sMap,
            10: sMap,
            11: sMap,
            12: sMap,
            13: sMap,
            14: sMap,
            15: sMap,
            16: sMap
        }
    });
});

Demo