使用所选类隐藏特定行

Question

我有这张桌子：

while ($row = mysqli_fetch_array($result)) {
echo '<tr>';
    echo '<td> <button value="' . $row['id'] . '" class="btn btn-danger" id="delete"><i class="icon-remove icon-white"></i> Delete</button> </td>';
echo '</tr>';
}

结果如下：

我正在使用此javascript删除特定行：

<script type="text/javascript">
    $('.btn-danger').click(function() {
        alert("I am an alert box!");
        var one = $(this).val();
        $.post("post.php", { 
            id: one
        }, function(data) {
            if (data.response == 1) { 
                $(this).closest('tr').fadeOut(1000); //this line does not work 
            } 
            if (data.response == 0) { 
                alert("nope");
            } 
        }, "json");
    });
</script> 

淡出不起作用。不会发生褪色。我不确定这是错的，但是如果我使用id它会起作用。 $('#delete').closest('tr').fadeOut(1000);但问题是只有顶行才会消失，我不想使用id。我正在做关于课程的研究，但我仍然无法理解如何让它发挥作用。

请帮助我，并提前致谢。

Answer 1

在done处理程序中的

this没有引用单击的按钮，这就是问题所在。您可以使用闭包变量来解决问题。

$('.btn-danger').click(function () {

    alert("I am an alert box!");
    var $this = $(this),
        one = $this.val();
    $.post("post.php", {
        id: one
    }, function (data) {
        if (data.response == 1) {
            $this.closest('tr').fadeOut(1000); //this line does not work 
        }
        if (data.response == 0) {
            alert("nope");
        }
    }, "json");

});