jquery在向其添加html后向div添加切换功能答案

【问题标题】：jquery add toggle function to div after adding html to itjquery在向其添加html后向div添加切换功能
【发布时间】：2016-09-12 01:55:22
【问题描述】：

如何将切换功能添加到在单击时填充有 ajax 响应的 div。现在我可以实现这两个功能，但我需要两次单击才能在填充后显示 div。我可以一键完成（即填充 div 并添加切换功能）吗？

任何帮助将不胜感激。

我的代码：

$(document).ready(function(){ 
  $(".ex2").on('click', '.spnSelected', function() { 
    var self = $(this).closest("tr"); 
    var col1_value = self.find(".col1").text(); 
    $.ajax({ 
      type: 'GET', 
      url: 'reportForm.php', 
      data: { propid: col1_value }, 
      success: function(response) { 
        $('#form'+col1_value).html(response);
        $('#form'+col1_value).toggle(); 
      } 
    }); 
  }); 
});

【问题讨论】：

听起来您需要一个委托的事件处理程序，而不是在 AJAX 更新每个元素时将事件附加到每个元素。我们需要查看您的代码以帮助您
将第二次点击函数中的代码移动到成功的 ajax 调用中（在填充 div 之后）。另外请出示您的代码，否则我们真的无能为力
$(document).ready(function(){ $(".ex2").on('click', '.spnSelected', function() { var self = $(this).最接近（“tr”）；var col1_value = self.find（“.col1”）.text（）；$.ajax（{类型：'GET'，url：'reportForm.php'，数据：{propid：col1_value} , 成功：function(response) { $('#form'+col1_value).html(response); $('#form'+col1_value).toggle(); } }); }); });

标签： php jquery html css ajax

【解决方案1】：

第二行 $(".ex2").on('click', '.spnSelected', function() { 更改为 $("body").on('click', '.ex2 .spnSelected', function() { 应该像魅力一样工作。

在您的代码中，您在 .ex2 点击时附加了事件，因此如果您使用 ajax 添加更多 .ex2 元素。您没有在新元素上附加事件。当您点击 body 上的点击事件，然后检查 .spnSelected 是否点击了此事件，这应该适用于新元素。

【讨论】：