如何使页面等待删除完成，然后刷新

Question

我对使用javascript和ajax很陌生。所以我有一个按钮，当单击该按钮时应该删除该项目。

<button type="submit" class="delete-button" data-id="{{ d_id }}">Delete</button>

我使用ajax发送删除POST请求。发生这种情况时（该项目需要一段时间才能删除），我该如何在HTML中添加一个加载圆圈。我想在处理请求时显示一个处理栏或类似的东西，完成后，刷新显示更改。当前，在成功删除之后，用户只有手动刷新页面才能看到更改。

$(document).ready(function() {
    $(".delete-button").click(function () {
        var d_id = $(this).attr('d_id');
        $.ajax({
            type: "POST",
            url: "/delete/" + d_id
        }).done(function (data) {
            if (data === 'Deleted') {
                console.log("Deleted") 
            } else {
                console.log("Failed")
            }
        })
    });
});