Tablesorter 未对动态添加的内容进行排序答案

【问题标题】：Tablesorter not sorting on dynamically added contentTablesorter 未对动态添加的内容进行排序
【发布时间】：2013-02-15 17:01:22
【问题描述】：

我在使用 Jquery Tablesorter 时遇到问题，我将数据动态添加到预先存在的表中。

根据文档，添加内容后，只需运行$("table").trigger("update") 以告诉 tablesorter 新内容已添加，但实际上这似乎不起作用。

有关示例，请参阅 http://jsfiddle.net/7Wurn/9/。单击 HTML 表格标题将对列进行排序，但在添加新行后，新行不会被排序。

似乎有些小问题是错误的，因为 Tablesorter 网站上使用的示例使用的代码与我在 JSFiddle 上添加的代码几乎相同。唯一的区别是 $("table").trigger("update"); 在 Ajax 调用之后作为回调的一部分运行。

有什么想法吗？

【问题讨论】：

标签： javascript jquery tablesorter

【解决方案1】：

在jQuery 中使用datatables 时，我也遇到了同样的问题。当您将其附加到table 时，您并未将数据附加到same tbody element。相反，您的数据被添加到 new tbody 元素中。表格格式应该是<thead></thead>，然后是<tbody></tbody>。

做这样的事情：

$("#tableId tbody").append(someContent);

我已经更新了你的小提琴http://jsfiddle.net/7Wurn/68/。也请使用 jquery 1.9.1。它在 2.0b1 中不起作用。不知道为什么

【讨论】：

@Mottie 谢谢。我在检查元素中看到每次添加一行时都会添加一个新的 tbody。但后来忽略了。感谢您的澄清。

【解决方案2】：

我一直在玩这个，发现它与在 DOM 中如何呈现 tbody 标签有关。

我通过执行以下操作使其适用于第一个条目：

$("table tbody:first").before('<tr><td>Aaphod</td><td>Beeblebrox</td> <td>28</td> <td>$9.99</td> <td>20%</td><td>jul 6, 2006 8:14 am</td></tr>');

那是因为它将它粘贴到第一个 tbody 中，并且 tablesorter 可以识别它。但是，后续添加会导致它作为新的 tbody 标记插入。

我会继续玩它，如果我有什么会更新！

【讨论】：