ajax调用后无法删除元素

Question

我有这个脚本:

<script type="text/javascript">
$(document).ready(function(){
    $(document).on('click','.remove',function(e){
        // e.preventDefault();
        var data = $(this).data('file');
        $.ajax({
            type:'POST',
            url:'/backup/delete',
            data:'fileName='+data,
            success: function(data){
                $(this).parents('tr').remove();
            }
        },'json');
    });
});

和文件部分:

<tr>
                <td>adif20150331133844.adi</td>
                <td style="width: 2em"><span class="remove link" data-file="adif20150331133844.adi"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></span></td>
                <td style="width: 2em"><span class="restore link" data-file="adif20150331133844.adi"><span class="glyphicon glyphicon-repeat" aria-hidden="true"></span></span></td>
            </tr>

任务是删除文件后删除tr部分.我不能让它发挥作用.文件被删除,响应是200,好的但是remove()也不起作用,即使我用ajax中的complete替换成功.会是什么呢？

Answer 1

元素的上下文在ajax调用中丢失,您可以使用选项将上下文设置为ajax context:

$.ajax({
        type:'POST',
        url:'/backup/delete',
        context:this,
        data:'fileName='+data,
        success: function(data){
            $(this).parents('tr').remove();
        }
    },'json');

ajax中的上下文选项