Javascript jQuery tablesorter使用TableSorterPage和隐藏行

目前，我在一个表中有一个很大的结果集，在该表中，我基于页面中的其他过滤器将一类“隐藏”（display:none）应用到某些行并将其删除。我可以开始使用zebra小部件，但是当我尝试在其中包含时，脚本没有出现任何错误

我尝试从表行中删除“hidden”类，它限制了结果，但不创建分页控件，如果尝试排序，结果将消失，脚本也将消失

$('table').tablesorter({
    widthFixed:true,
    widgets: ['zebra']}
).tablesorterPager({
    container: $("#pager")
});

这就是在文档就绪时调用的代码

在任何给定的时间，以下是一些数据的示例行（pre-tablesorter）：

样本行1
100
12
1.
1.
0
样本行2
100
12
1.
1.
0
样本行3
100
12
1.
1.
0

这是tableSorter寻呼机插件的构造函数。正如您所见，它基于配置（cssFirst、cssNext、cssPrev、csslat）将click函数绑定到元素。不幸的是，这意味着这些元素必须已经存在于由“config.container”定义的容器中。这似乎在寻呼机插件站点的任何地方都没有记录。但您必须使用以下默认类定义（在html中，或在调用pager函数之前使用javascript）元素：

            cssNext: '.next',
            cssPrev: '.prev',
            cssFirst: '.first',
            cssLast: '.last',

我不确定表排序器将如何与隐藏行交互，您可能需要对核心表排序器功能进行一些修改，以获得所需的行为

/克里斯

这是tableSorter寻呼机插件的构造函数。正如您所见，它基于配置（cssFirst、cssNext、cssPrev、csslat）将click函数绑定到元素。不幸的是，这意味着这些元素必须已经存在于由“config.container”定义的容器中。这似乎在寻呼机插件站点的任何地方都没有记录。但您必须使用以下默认类定义（在html中，或在调用pager函数之前使用javascript）元素：

            cssNext: '.next',
            cssPrev: '.prev',
            cssFirst: '.first',
            cssLast: '.last',

我不确定表排序器将如何与隐藏行交互，您可能需要对核心表排序器功能进行一些修改，以获得所需的行为

---

/Chris

您必须添加完整的寻呼机DOM结构，如下所示：

  <div id="pager" class="pager">
<form>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/first.png" class="first"/>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/prev.png" class="prev"/>
  <input type="text" class="pagedisplay"/>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/next.png" class="next"/>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/last.png" class="last"/>
  <select class="pagesize">
    <option selected="selected"  value="10">10</option>
    <option value="20">20</option>
    <option value="30">30</option>
    <option  value="40">40</option>
  </select>
</form>

10
20
30
40

---

另外请注意，我下载的zip不包含任何图像文件，因为“图标”文件夹丢失。同样令人恼火的是，zip包含svn repo文件夹。因此，您必须添加此“图标”文件夹和其中的图像文件。您可以从寻呼机的tablesorter示例页面下载图像文件。我还必须直接设置图像的路径（请注意，在我的代码示例中我是这样做的）。祝你好运

您必须添加完整的寻呼机DOM结构，如下所示：

  <div id="pager" class="pager">
<form>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/first.png" class="first"/>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/prev.png" class="prev"/>
  <input type="text" class="pagedisplay"/>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/next.png" class="next"/>
  <img src="javascript/jqPlugins/tablesorter/addons/pager/icons/last.png" class="last"/>
  <select class="pagesize">
    <option selected="selected"  value="10">10</option>
    <option value="20">20</option>
    <option value="30">30</option>
    <option  value="40">40</option>
  </select>
</form>

10
20
30
40

---

另外请注意，我下载的zip不包含任何图像文件，因为“图标”文件夹丢失。同样令人恼火的是，zip包含svn repo文件夹。因此，您必须添加此“图标”文件夹和其中的图像文件。您可以从寻呼机的tablesorter示例页面下载图像文件。我还必须直接设置图像的路径（请注意，在我的代码示例中我是这样做的）。祝你好运

您的表行是否在tbody中，可排序行是否有一个thead，页面是否在表外浮动？您的表行是否在tbody中，可排序行是否有一个thead，页面是否在表外浮动？谢谢Chris。这种情况消失了，因为我们朝着延迟加载结果的方向前进。我会更多地使用tablesorter的核心，如果我找到了，我会发布一个解决方案。谢谢Chris。这种情况消失了，因为我们朝着延迟加载结果的方向前进。我会更多地使用tablesorter的core，如果我找到了它，我会发布一个解决方案。thx我花了很长时间才喜欢这个插件，但是说明很弱，我不得不下载单独的图片：）（你忘了关闭）thx我花了很长时间才喜欢这个插件，但是说明很弱，我不得不下载分开的图片：）（你忘了关门）