php - jQuery 添加带有可点击行的动态表

Question

我是 jQuery 的新手，我看到了如何将可点击的动态 TR 添加到现有表格的示例，但我如何才能动态添加具有可点击的 TR 的全新表格？

我的 HTML 代码:

<input type="text" id="containing"><div id="results"></div>

我的 jQuery 代码，它发布输入并将新的 HTML 表返回到结果 div 中:

$("#containing").on("keyup", function() 
{
 $.post("http://URL.com/search.php", { searcher: $(this).val() },function(data, textStatus) 
 { 
  $("#results").html(data);
 });
});

Search.php 返回以下格式:

<table id="resultantTable"><tr><a href="..."></a><td></td></tr></table>

...和其他 jQuery 代码应该让我点击新的表格行，但它不起作用:

$(document).ready(function() 
{
 $("#resultantTable").on('click','tr',function()
 {
  var href = $(this).find("a").attr("href");
  if(href) 
  {
   window.location = href;
  }
 });
});

此 jQuery 代码适用于随文档加载的表，但我无法使 TR 在从 search.php 返回的动态创建的表中可单击。

有什么想法吗？

Answer 1

您需要在父级上添加监听器。示例:

$(document).on('click', '#resultantTable tr', function(e){
  //ToDo...
});