jQuery tablesorter、staticwidget 和 sortList 在一起？

Question

我不明白为什么两者不能一起工作。我有一个 table 可以很好地与 table 分类器一起分类。我已将行样式设置为看起来更像漂亮的 div，并需要在每行之间添加一个 space。我使用带有 CSS class 的空对象来执行此操作，然后也应用 'static' 小部件。这一切都很好，排序时，那些不可见的间距行保持不变。

当我尝试同时设置默认排序列表时出现问题。我尝试了下面的不同代码；试图将其设置为 javascript 并作为元数据。两者根本不会一起工作。只要我禁用静态小部件，我就可以让 sortList 正常工作。但是当它们在一起时，行是静态的，而是堆叠在一起并且不按排序顺序排列。

谁能帮我想办法让静态小部件和 sortList 一起工作？谢谢！

（我在 html 头部加载了 jQuery 2.14、tablesorter、staticRow 小部件和元数据 .js）

它不会以这种方式一起工作：

$(document).ready(function(){ 
    $('#myTable').tablesorter({
        widgets: ['staticRow'],
        sortList: [[0,0]]
    });
} );

但可以单独使用：

$(document).ready(function(){ 
    $('#myTable').tablesorter({
        widgets: ['staticRow']
    });
} );

或

$(document).ready(function(){ 
    $('#myTable').tablesorter({
        sortList: [[0,0]]
    });
} );

也试过这个：

$(document).ready(function(){ 
    $('#myTable').tablesorter({
        widgets: ['staticRow']
    });
} );

<table id="myTable" class="tablesorter {sortlist: [[0,0],[4,0]]}">

Answer 1

问题是 tablesorter 在应用小部件之前对 table 进行排序。因此，小部件在排序后设置行索引。如果你有一个小 table，最简单的解决方案是在 tablesorter 初始化后触发排序 (demo)

$('#myTable')
  .tablesorter({
    widgets: ['staticRow']
   })
   .trigger("sorton", [[[0,0]]]);

如果您有更大的 table，初始化之前将需要更多时间。在这种情况下，在 setTimeout.

中添加 trigger

更新：您可以使用以下代码防止快速搜索隐藏所有静态行：

$('input#search').quicksearch('table tbody tr', {
  hide: function(){
    this.style.display = $(this).hasClass('static') ? "table-row": "none";
  }
});

但你最终会遇到一些非常大的差距 (demo)。

要解决此问题，您需要添加一些 css；您需要使用 !important 标志来覆盖内联样式 (demo)。

tr[style*="display: none"] + tr.VerticalSpacer {
  display: none !important;
}

jQuery tablesorter、staticwidget 和 sortList 在一起？

jQuery tablesorter, staticwidget and sortList together?

jquery

tablesorter