Question

我正在使用jQuery tablesorter对表进行排序，并希望在排序后在行组之间产生某种分隔。例如，如果我使用的是带有标题，类别和年份的表格，一旦排序，某一年的所有行都会在其他行之间有一定的填充量。

例如：

Title Cat 2012
Title Cat 2012
Title Cat 2012


Title Cat 2011
Title Cat 2011
Title Cat 2011


Title Cat 2010
Title Cat 2010

我想它会与构建一个小部件和比较每一行的值有关，如果一行与前一个值不匹配，那么它应该应用一些某种填充但我有点不知所措。

JSBIN： http://jsbin.com/osehoy

非常感谢任何方向/帮助，谢谢！

Answer 1

我不确定你是否想在它们之间添加一个空行或只是让行更高，所以我选择了后者。这是我制作的小部件和demo：

$.tablesorter.addWidget({
    id: 'spacer',
    format: function(table) {
        var c = table.config,
        $t = $(table),
        $r = $t.find('tbody').find('tr'),
        i, l, last, col, rows, spacers = [];
        if (c.sortList && c.sortList[0]) {
            $t.find('tr.spacer').removeClass('spacer');
            col = c.sortList[0][0]; // first sorted column
            rows = table.config.cache.normalized;
            last = rows[0][col]; // text from first row
            l = rows.length;
            for (i=0; i < l; i++) {
                // if text from row doesn't match last row,
                // save it to add a spacer
                if (rows[i][col] !== last) {
                    spacers.push(i-1);
                    last = rows[i][col];
                }
            }
            // add spacer class to the appropriate rows
            for (i=0; i<spacers.length; i++){
                $r.eq(spacers[i]).addClass('spacer');
            }
        }
    }
});

$('table').tablesorter({
    widgets : ['spacer']
});

更新：我的forkorter可以对多个tbodies进行排序，因此上面的脚本在没有稍加修改rows = table.config.cache[0].normalized;的情况下无效 - 这里有updated demo有效用我的叉子。上面的代码将与原始的tablesorter插件一起使用。

jQuery Tablesorter - 可以对“排序”行进行分组吗？

1 个答案: