Question

我的HTML看起来像。

<ul>
     <li>
        <a id="MP0003631" class="pheno" href="#">nervous system phenotype</a>
    </li>
<ul>

单击时，JQuery，如下所示：

$(".pheno").on("click", function(){
var id = $(this).attr("id");

$.ajax({
    type: "POST",
    url: "treescript.php",
    data: { pheno: id}
    }).done(function( msg ) {
     $('#'+id).after("<br>"+msg+"");
     alert(id);
    });

});

将创建如下所示的HTML：

<ul>
   <li>
      <a id="MP0003631" class="pheno" href="#">nervous system phenotype</a>
   <ul>
       <li>
            <a id="MP0003632" class="pheno" href="#">abnormal nervous system morphology</a>
       </li>
        <li>
            <a id="MP0003633" class="pheno" href="#">abnormal nervous system physiology</a>
        </li>
   </ul>
   </li>
</ul>

问题是，正在创建的内容无法被JQuery识别。这可能吗？

Answer 1

您可以在委派模式下使用jQuery的on()来附加到与您的选择器匹配的稍后时间添加的任何元素。

$("#dataTable tbody").on("click", "tr", function(event){
    alert($(this).text());
});

以上匹配动态添加到tr的任何#dataTable tbody（在上述代码执行时必须存在）。

您也可以使用表格

$(document).on("click", "tr", function(event){
    alert($(this).text());
});

将点击处理程序添加到任何 tr，稍后会在文档的任何位置添加。

如何将click处理程序附加到稍后添加的内容 - J Query

1 个答案: