使用 Ajax 的结果更新 Dom，但操作事件不起作用

Question

我正在开发一个评论重播系统，就像任何社交媒体网站一样，但使用 YII2 框架 我创建了 Wedget 来显示某些项目（如产品）的评论列表 每个评论都带有“重播”按钮，允许用户发送该评论的重播 或向该项目（产品）添加新评论。 我使用 Ajax.post 发布帖子并检索新插入的评论。 我的问题是：

当我发布请求并得到结果时 如何附加此结果（最佳方法），这样如果按下新插入的评论按钮就会触发

这将发送帖子并获得结果..

$.ajax({
  url: '$url',
  type: 'POST',
  data: formData,
  success: function(result) {
    if (result.success === 1) {
      //alert(result.msg);
      var new_comment = result.data;
      $(new_comment).appendTo('#comment_' + id + '_container');
      //$('#comment_'+id+'_container').append(new_comment);
      $(bdySelector).val('');
      $('.hideme_' + id).toggleClass('d-none');
      return false;
    } else
      $(bdySelector).val('');

    $('#errors' + id).removeClass('d-none').innerText(result.errors);
    return true;
  }

此代码应该适用于新插入的评论，但事实并非如此

$(document).on('click', '.ShowDialog', function(e) {
  var id = document.getElementById(e.target.id).getAttribute('data-comment-id');
  $('.hideme_' + id).toggleClass('d-none');
});

---

简而言之：我需要将一些 HTML 结果附加到 Continer 中 但这个插入的 HTML 结果没有响应我在它自己的按钮上的点击事件

我已经尝试过但不起作用

$.ajax({
  url: '$url',
  type: 'POST',
  data: formData,
  success: function(result) {
    if (result.success === 1) {
      //alert(result.msg);
      var new_comment = result.data;
      $(new_comment).appendTo('#comment_' + id + '_container');
      //$('#comment_'+id+'_container').append(new_comment);
      $(bdySelector).val('');
      $('.hideme_' + id).toggleClass('d-none');
      return false;
    } else
      $(bdySelector).val('');

    $('#errors' + id).removeClass('d-none').innerText(result.errors);
    return true;
  }

Answer 1

使用这条线解决了我的问题

$(document).on('click','.add_comment', function(e) {}

我以前的错误是：没有$（文档） $('#add_comment_'+$comment->id).on('点击', function(e) {

---

我的 Ajax 结果以评论块的形式返回 所以我只是使用以下方法附加它： $.ajax( { 网址: '$url', 类型：'发布'， 数据：表单数据， 成功：函数（结果）{ if(结果.成功 === 1){ $(bdySelector).val(''); $('.hideme_' + id).toggleClass('d-none'); var new_comment =结果.data; var new_nxt =$('#comment_'+id+'_container'); $(new_nxt).append(new_comment); } 别的{ $(bdySelector).val(''); $('#errors'+id).removeClass('d-none').innerText(result.errors); 返回真； } }, 错误：函数（）{ $(bdySelector).val(''); $('#errors'+id).removeClass('d-none').innerText('$errMsg'); 返回假； } });