jquery get関数の後のフェードアウト

Question

クラス内のspanにremoveFileのクラスを追加しました。クリックすると、jQuery $.getを使用してファイルが削除され、削除が成功すると、含まれるLIはfadeoutになります。私はこれがなぜ機能していないのかわかりません。私はそれを警告（データ）することはできますが、変数に代入したり、​​コマンドを実行したりすることはできません。 Ajaxのコールバック関数thisインサイド

$('#files').on('click', '.removeFile', function (event) { 
    event.preventDefault(); 
    var fileUrl = $(this).data('file-url'); 
    if (confirm('Are you sure you want to delete this file?')){ 
     $.get('process.php', {'remove-file':fileUrl}, function(data){ 
      if(data=='true'){ 
       $(this).parent().fadeOut(); 
      } 
     }); 
    } 
}); 

<li class="file"> 
<span class="file" data-file-url="http://demo.com/filemanager/files/test.txt" title="test.txt">test.txt</span> 
<span class="removeFile" data-file-url="/files/test.txt"></span> 
</li> 

Answer 1

jqXHRオブジェクトを参照するので、あなたは変数としてAJAX呼び出しの外にそれを定義したり、それをcontext optionを設定する必要があります。 get()で

$('#files').on('click', '.removeFile', function (event) { 
    event.preventDefault(); 
    var $this = $(this); 
    var fileUrl = $this.data('file-url'); 
    if (confirm('Are you sure you want to delete this file?')){ 
     $.get('process.php', {'remove-file':fileUrl}, function(data){ 
      if(data=='true'){ 
       $this.parent().fadeOut(); 
      } 
     }); 
    } 
}); 

Answer 2

this.removeFileを参照しません。 thisは、get()というコールバックのxhrオブジェクトを参照しています。

$('#files').on('click', '.removeFile', function (event) { 
    event.preventDefault(); 
    var li = $(this).parent(); //added this line 
    var fileUrl = $(this).data('file-url'); 
    if (confirm('Are you sure you want to delete this file?')) { 
     $.get('process.php', { 'remove-file': fileUrl }, function (data) { 
      if (data == 'true') { 
       li.fadeOut(); //changed this line 
      } 
     }); 
    } 
});