새로 게시 된 Ajax 콘텐츠는 직접 삭제할 수 없지만 페이지를 새로 고친 후에는 삭제할 수 있습니까?

Question

사용자가 의견을 게시 할 수있는 의견 시스템이 있습니다.

$(function() { 
    $(".submit-comment").click(function() { 

     var text = $(".txtinput").val(); 
     var itemid = "<?=$id?>"; 
     var userid = "<?=$_SESSION['user_id']?>"; 
     var dataString = 'text=' + text + '&userid=' + userid + '&itemid=' + itemid; 

     if (text == '') { 
      $('#content_error1').fadeIn(250); 
      $('#content_error1').delay(1500).fadeOut(500); 
     } else {  
      $.ajax({ 
       type: "POST", 
       url: "/ajax/comments.php", 
       data: dataString, 
       success: function(html) { 
        $('#messages').prepend($(html).hide().fadeIn(1000)); 
        $('.txtinput').val('');  
       } 
      }); 
     } 
     return false; 
    }); 
});​ 

이 html 출력 제공 :

$(function() { 
    $(".imgswap_del").click(function() { 

     var comment_id = $(this).attr('att'); 
     var dataString = 'comment_id=' + comment_id; 

     $.ajax({ 
      type: "POST", 
      url: "/ajax/delete_comment.php", 
      data: dataString, 
     }).done(function(result) { 
      myresult7(result); 
     }); 

     return false; 
    }); 
});​ 

내가 원하는 :

<div class="com_loaded" id="id<?=$comment_id?>"> 
    <div id="com_loaded_height"></div> 
    <div id="com_loaded_userpic"><a onClick="parent.$.fn.colorbox.close();" target="_parent" href="profile.php?id=<?=$row['user_id']?>" 
     class="tooltip"><img src="<?=$row['user_pic']?>" class="img_poster" /><span><?=$row['user_name']?></span></a> 
    </div> 
    <div id="com_loaded_content"> 
     <div id="com_loaded_poster"><a onClick="parent.$.fn.colorbox.close();" target="_parent" href="profile.php?id=<?=$row['user_id']?>"><?=$row['user_name']?></a> 
     </div> 
     <div id="com_loaded_text"> 
     <?=$row[ 'comment_text']?> 
     </div> 
    </div> 
    <div id="com_loaded_divide"></div> 
    <div class="del_com"><span class="imgswap_del" att="<?=$comment_id?>"><img src="img/popup/close-small.png" alt="Delete comment"></span> 
    </div> 
</div> 

지금이 아약스 호출을 사용하여 댓글을 삭제할 수를 주석의이 게시물은 아약스 호출입니다 게시 후 사용자가 직접 주석을 삭제할 수있는 옵션을 제공하십시오. 이것은 작동하지 않습니다. 하지만 이상한 부분은 페이지를 새로 고침하면 기능이 작동한다는 것입니다. ajax 호출을 사용하여 주석을 게시 한 후이 작업을 직접 수행하려면 어떻게해야합니까? 먼저 페이지를 새로 고침하고 싶지 않습니다!

Answer 1

이벤트 위임을 사용하여 삭제 클릭 이벤트를 바인딩하거나 새로운 주석이있을 때마다 다시 바인딩해야합니다. 이벤트 위임을 제안합니다. 그것은 당신에게 가장 가까운 부모 요소를 제공,

$(document).on("click",".imgswap_del",function() {... 

은 위의 작동합니다,하지만 당신은 자신의 코드를 읽으면

$("#messages").on("click",".imgswap_del",function() {...