Question

我的问题基本上是the same as this one（从未得到妥善回答）。

如何在动态添加的项目上使用jQuery函数？

具体来说，我希望在用户执行某些操作后动态加载到页面上的jquery tablesorter plugin。

这是我的代码：

 results_html += "<table id='results' class='tablesorter><thead>"; 
 [My table contents go here, ommitted for this question]
 results_html += "</tbody></table>";
 $('#book_results').html(results_html);
 $("#results").tablesorter();

页面上没有JS错误，但没有应用tablesorter函数。我该怎么办？

谢谢！

Answer 1

Tablesorter有一个触发器函数，您可以调用该函数将一个tablesorter添加到动态添加的元素中。请在此处查看Ajax example。这样的事情对你有用：

 $("#results").tablesorter(); 
 $("#results").trigger("update");

有时您需要致电$("#results").trigger("appendCache");。我还没有找到原因。

Answer 2

查看该代码，我只能想到两个不起作用的原因：

如果results不是页面上的唯一ID。

如果开头行中的拼写错误实际上在您的代码中（您在'tablesorter'类之后错过了结束'：

results_html += "<table id='results' class='tablesorter><thead>"; 
                                                    // ^-- here

从根本上说，它的工作原理是：http://jsbin.com/ikebu4/2这看起来并不多，因为我没有包含任何表格分类器CSS，但是如果单击列标题，它就会起作用。基本上有一个预先存在的表，然后是一个动态添加一个的按钮。 tablesorter的东西适用于两者。

将jQuery函数应用于动态添加项

2 个答案: