jQueryは親を削除できませんか？

Question

私は "draggable" jquery uiであるdiv内に要素を持っています。そして、そのdiv全体を削除しようとしています。私の要素は次のようになります

<div class="draggable"> 
    <img ...> 
    <div class="delete">CLICK TO DELETE</div> 
</div> 

そして、その上にドラッグ可能なイベントがあります。削除ボタンをクリックすると、そのdiv全体が削除されます。しかし、それは動作していないようです。私は$(this).parent/parents.removeを試しましたが、それらのどちらもうまくいきませんでした。どんな種類のオブジェクトも返しませんでした（console.log($(this).parent()); []を返します）。

私の削除機能は

// Delete Image functionality 
    $('.delete').click(function() { 

     $this.parent().draggable('disable'); 

     // Post the DELETE request 
     $.get('delete/', { d: '1' , id:photo }, function(data) { 
      if (data == "true") { 
       $(this).parent().remove(); 
      } else { 
       alert("An error has been encountered, please try again later"); 
      } 
     }); 
    }); 

まで何任意のアイデアのように見えますか？

Answer 1

$.getへのコールバック内でthisがjqXHRインスタンスに設定されているという問題があります。例えば、this.responseTextのようにすることができます。明らかに要素には設定されません。

あなたが要素に上書きされないエイリアス与える必要があります：あなたはそれを行うことができ、様々な他の方法があり

$('.delete').click(function() { 
    var clicked = this; 
    $this.parent().draggable('disable'); 

    // Post the DELETE request 
    $.get('delete/', {d:'1',id:photo}, function(data) { 
     if(data == "true") { 
      $(clicked).parent().remove(); 
     }else{ 
      alert("An error has been encountered, please try again later"); 
     } 
    }); 
}); 

を：最も効率的には、おそらくそれvar parent = $(this).parent().draggable('disable')（draggableを推定することはチェーン可能である、だろう）です。別のオプションは、イベントのcurrentTargetプロパティで行くことになります：

$('.delete').click(function(event) { 
    // ... 
      $(e.currentTarget).parent().remove(); 

私が与えてくれたバージョンは、これは私がそれを選んだ理由である、あなたのために動作しなかった理由を示すでおそらく最も明確だと思います。

Answer 2

"this"は内側の関数の内側が外側の "this"とは異なります。 "this"を別の変数に格納し、その変数を外部関数内で使用してみてください。すなわち、

// Delete Image functionality 
    $('.delete').click(function() { 

     $this.parent().draggable('disable'); 
     var that = $(this); 

     // Post the DELETE request 
     $.get('delete/', {d:'1',id:photo}, function(data) { 
      if(data == "true") { 
       that.parent().remove(); 
      }else{ 
       alert("An error has been encountered, please try again later"); 
      } 
     }); 
    });