Wie man eine Tabellenzeile mit Javascript korrekt entfernt?

Question

Ich verwende das folgende 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> 

Ich bin versucht, eine Zeile mit dem folgenden 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(); 
    }); 
}); 

entfernen Dies ist nicht die Zeile zu löschen.

Irgendwelche Vorschläge?

Answer 1

Sie sollen die this Variable in einer anderen Variablen speichern, sonst Ihre Referenz in der done(..) Funktion die nicht die gleiche Referenz Original a Sie klickten:

$("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

Sollte nicht der Wähler seine

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

statt

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

Answer 3

this innerhalb der done ist nicht der Anker.

console.log(this) wird zeigen, dass

Sie binden

verwenden können

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