如何正確地使用javascript刪除表格行？

Question

我正在使用以下HTML。

<tr id="1"> 
<td></td> 
<td><input class="form-control" value="Extra Data"></td> 
<td><a href="#save" class="addsub_MS btn btn-primary btn-lg" id="1">Save</a></td> 
<td><a href="#delete" class="delete_MS btn btn-primary btn-lg" id="1">Delete</a></td> 
<td></td> 
</tr> 

我嘗試使用下面的JavaScript

$("a[href=#delete]").click(function() { 
var id; 
if ($(this).hasClass('delete_MS')) { 
    var id = $(this).attr("id"); 
    } 
    var data = { 
     id: id 
    }; 
    $.ajax({ 
     type: "POST", 
     url: "deleteparent.php", 
     data: data 
    }).done(function() { 
     $(this).closest('tr').remove(); 
    }); 
}); 

這不會刪除行刪除行。

有什麼建議嗎？

Answer 1

您應該保存this變量在不同的變量，否則done(..)函數內部引用是不一樣的參考您點擊原版a：

$("a.delete_MS").click(function() { 
    var id; 
    var that = this; 
    if ($(this).hasClass('delete_MS')) { 
     var id = $(this).attr("id"); 
    } 
    var data = { 
     id: id 
    }; 

    $.ajax({ 
     type: "POST", 
     url: "deleteparent.php", 
     data: data 
    }).done(function() { 
     $(that).closest('tr').remove(); 
    }); 
}); 

Answer 2

不宜選擇是

`$("a[href=#delete]") or $('.delete_MS')` 

代替

$("a[href=#deleteparentms]") 

Answer 3

this裏面的done不是主播。

console.log(this)將顯示

可以使用綁定

}).done((function() { 
    $(this).closest('tr').remove(); 
}).bind(this))};