javascript - 为什么这个脚本不删除父元素

Question

我不确定为什么这不起作用，并且由于我有限的 jquery 能力，我无法找到问题的根源。下面的脚本删除所有内容，而不仅仅是父元素。

非常感谢您提供一些帮助。

谢谢，莉亚

脚本:

    // Delete post
    $('a.delete').livequery("click", function(e){

    if(confirm('Are you sure you want to delete this post?')==false)

    return false;

    e.preventDefault();

    var parent  = $('a.delete').parent();

    var temp    = parent.attr('id').replace('record-','');

    var main_tr = $('#'+temp).parent();

        $.ajax({

            type: 'get',

            url: 'delete.php?id='+ parent.attr('id').replace('record-',''),

            data: '',

            beforeSend: function(){

            },

            success: function(){

                parent.fadeOut(200,function(){

                    main_tr.remove();

                 });

            }

        });

    });

标记:

<span id="posting">
<div class="friends_area" id="record-23">
       <img src="temp/user_icon.gif" style="width: 50px; height: 48px; float: left;" alt="">

           <label style="float: left;" class="name">

           <b>99Points</b>

           <em>ry ewst yewsrtg eswtg</em>

           <br clear="all">

           <span style="font-weight: normal;">
           9 minutes ago
           </span>
           <a href="javascript: void(0)" id="post_id23" class="showCommentBox">Comments</a>

           </label>
                    <a style="display: none;" href="#" class="delete"> Remove</a>

                    <br clear="all">
            <div id="CommentPosted23">
                            </div>
            <div class="commentBox" id="commentBox-23" style="display: none;" align="right">
                <img src="small.png" class="CommentImg" style="float: left;" alt="" width="40">
                <label id="record-23">
                    <textarea class="commentMark" id="commentMark-23" name="commentMark" cols="60"></textarea>
                <div>Write a comment...&nbsp;</div></label>

                <br clear="all">
                <a id="SubmitComment" class="smallbutton"> Comment</a>
            </div>
       </div>
           <div class="friends_area" id="record-22">

       <img src="temp/user_icon.gif" style="width: 50px; height: 48px; float: left;" alt="">

           <label style="float: left;" class="name">

           <b>99Points</b>

           <em>hywr ywerywersywrsey ry r</em>
           <br clear="all">

           <span style="font-weight: normal;">
           9 minutes ago
           </span>
           <a href="javascript: void(0)" id="post_id22" class="showCommentBox">Comments</a>

           </label>
                    <a style="display: none;" href="#" class="delete"> Remove</a>
                    <br clear="all">
            <div id="CommentPosted22">
                            </div>
            <div class="commentBox" id="commentBox-22" style="display: none;" align="right">
                <img src="small.png" class="CommentImg" style="float: left;" alt="" width="40">

                <label id="record-22">
                    <textarea style="overflow: hidden; color: rgb(51, 51, 51);" class="commentMark" id="commentMark-22" name="commentMark" cols="60"></textarea>
                <div style="position: absolute; display: none; font-weight: 400; width: 300px; font-family: monospace; line-height: 14px; font-size: 11px; padding: 0px;">Write a comment...&nbsp;</div></label>
                <br clear="all">
                <a id="SubmitComment" class="smallbutton"> Comment</a>
            </div>
       </div>

        <div id="bottomMoreButton">
    <a id="more_10" class="more_records" href="javascript: void(0)">Older Posts</a>
    </div>
                </span>

Answer 1

使用$(this)代替类选择器:)。现在您正在删除该类的所有项目。

var parent  = $(this).parent();

此外，请注意您不能在 ajax 调用中使用 $(this) (因为它将引用 ajax 调用)，因此您(不小心？)通过存储来做正确的事情它位于一个变量中，并对其调用 .remove() 。