在动态修改的表上使用 jQuery tableSorter答案

【问题标题】：Using jQuery tableSorter on dynamically modified table在动态修改的表上使用 jQuery tableSorter
【发布时间】：2008-10-29 15:45:36
【问题描述】：

我在页面上使用 jQuery tableSorter 插件。

不幸的是，正在排序的表是动态修改的，当我添加元素后排序时，该元素消失了，将表恢复到创建 tableSorter 时的状态。

有什么方法可以强制 tableSorter 重新扫描页面，以便正确排序这些新元素？

【问题讨论】：

标签： jquery tablesorter

【解决方案1】：

我相信您可以使用以下方式触发更新：

$(table).trigger("update")

【讨论】：

只是一个注释，我需要使用这样的代码：$("#table_id").trigger("update");

【解决方案2】：

看来你是对的。

$(table).trigger("更新"); $(table).trigger("appendCache");

成功了。

请注意，tablesorter API 在某些时候发生了变化，因此这些事情以及事件绑定都发生了变化。我最大的困扰是试图弄清楚为什么有些东西有效而另一些无效，这是由于插件版本错误，尽管没有明显的区别。

【讨论】：

这应该是公认的答案。没有“appendCache”部分，我只能按一个方向排序（第一次点击排序，第二次什么都不做），就像 Josh 的回答一样。但有了它，一切都按预期工作。请注意，如果更新发生在您创建 tablesorter 对象的另一个代码块中，您可以在那里重新创建它。假设您的 tablesorter tabe 的 id 为“ts”。执行$("#ts").tablesorter().trigger("update"); 和appendCache 相同。或：$table = $("#ts").tablesorter(); $table.trigger("update"); $table.trigger("appendCache");
另一方面，我刚刚发现如果您只是删除了一行，这个答案将不起作用。如果您删除一行，我不确定您是否真的需要做任何事情。

【解决方案3】：

$(table).trigger("update"); 抛出错误

    Uncaught TypeError: Cannot read property 'rows' of undefined

所以，有一个 jquery 函数 .ajaxStop()，其中调用了 tablesorter()。不要在.ready()中调用tablesorter

    jQuery(document).ajaxStop(function(){
      jQuery("#table_name").tablesorter();
    })

谁做的工作

【讨论】：

【解决方案4】：

对于像我这样面临排序动态生成表问题的新手，这里是解决方案。前面给出的答案是正确的，但是你把这个命令放在哪里呢？

$('#tableId').tablesorter().trigger('update');

您需要在将数据附加到表格后立即放置它。前在我的情况下

var tableData = "<thead><tr><th>Name</th><th>Age</th></thead><tbody><tr><td>Izaki</td><td>24</td><tr><tr><td>Serizawa</td><td>25</td></tr>";
$('#tableId').html('tableData');
$('#tableId').tablesorter().trigger('update');

【讨论】：