新发布的ajax内容无法直接删除但刷新页面后可以删除吗?

时间:2012-11-12 19:53:26

标签: php jquery ajax

我有一个评论系统,用户可以发表评论。这个评论的发布是一个ajax调用:

$(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输出:

<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调用删除评论:

$(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;
    });
});​

我想让用户选择在发布后直接删除评论。这不起作用。但奇怪的是,当我刷新页面时功能正常。在使用ajax调用发表评论后,如何直接完成此工作?我不想先刷新页面!

1 个答案:

答案 0 :(得分:4)

您需要使用事件委派绑定删除单击事件,或者使用每个新注释重新绑定它。我建议事件代表团。

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

上述方法可行,但最好使用更接近的元素,例如

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