爲什麼這個腳本刪除父元素

Question

我不知道爲什麼這不起作用，以及我有限的jquery能力，我一直無法找到問題的根源。下面的腳本將刪除所有內容，而不僅僅是父元素。

我喜歡這個幫助。

感謝，LEA

腳本：

// 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()就可以了。