jQuery Tablesorter + 分页，重新分页所有表格

Question

我有一个包含表格的页面。 在这张桌子上，我使用了两个插件：tablesorter 和 table pagination。

当用户尝试对行进行排序时，我想重新分页整个表。 问题是：当我尝试对行进行排序时，tablesorter 插件只会对我所在页面的行进行排序，直到我切换到另一个页面。

我想过用表格分页的触发器：

$table.trigger('repaginate');

但我不确定这个选择，我不知道如何使用它。

我创建一个fiddle 让您更好地理解。

Answer 1

更新答案

正如@Mottie 指出的那样，行实际上不需要可见，只需在排序后调用重新分页方法：

$("#risorse_in").bind("sortEnd", function() {
  $(this).trigger('repaginate');
});

这很好，因为没有原始答案中的丑陋副作用。

原始（部分错误）答案

tablesorter 插件仅对可见行进行排序。因此，在排序开始之前，所有行都需要可见。

这段代码使它们在排序之前和重新分页之后直接可见：

  $("#risorse_in").bind("sortStart", function() {
    $(this).find('tbody tr').show();
  }).bind("sortEnd", function() {
    $(this).trigger('repaginate');
  });

另外，这是更新后的小提琴：https://jsfiddle.net/ceaauh63/5/

此解决方案的缺点是额外的行可能会在瞬间可见。您可以通过添加 css 规则 opacity: 0

来避免这种情况

到这些行：

#risorise_in:nth-child(n+4) {
  opacity: 0;
}