防止js函数被执行两次

在我的应用程序有一个表与国家的数据，它也使用分页。对于每一行都有一个删除按钮，该按钮通过ajax触发一个函数，国家从数据库中删除，行向上滑动，表格根据我们所处的页面再次呈现。

这是我最初的功能:

$(document).on('click', '.glyphicon-remove', function(event) {
    var thiz = $(this);
    var id = thiz.next('input:hidden').val();
    $.ajax({
        url: '/country/' + id,
        type: 'DELETE'
    })
    .done(function() {
        thiz.parent().parent().parent()
            .find('td')
            .wrapInner('<div style="display: block;" />')
            .parent()
            .find('td > div')
            .slideUp(200, function() {
                thiz.parent().parent().remove();
                    if (curPage) {
                        if ($('.table > tbody > tr').length > 1) {
                            renderCountries(curPage);
                        } else {
                            var page = getURLParameter(curPage, 'page');
                            if (page !== '1') {
                                prevPage = previousPageURL(curPage, 'page');
                                renderCountries(prevPage);
                                curPage = prevPage;
                            } else {
                                renderCountries();
                            }
                        }
                    } else {
                        renderCountries();
                    }
            });
    });
});

然而，我发现slideUp()函数被执行了多次，这把整个事情搞砸了，我不知道原因，所以我改变了它，现在我使用delay():

$(document).on('click', '.glyphicon-remove', function(event) {
    var thiz = $(this);
    var id = thiz.next('input:hidden').val();
    $.ajax({
        url: '/country/' + id,
        type: 'DELETE'
    })
    .done(function() {
        thiz.parent().parent().parent()
            .find('td')
            .wrapInner('<div style="display: block;" />')
            .parent()
            .find('td > div')
            .slideUp(200)
            .delay(200, function() {
                thiz.parent().parent().remove();
                    if (curPage) {
                        if ($('.table > tbody > tr').length > 1) {
                            renderCountries(curPage);
                        } else {
                            var page = getURLParameter(curPage, 'page');
                            if (page !== '1') {
                                prevPage = previousPageURL(curPage, 'page');
                                renderCountries(prevPage);
                                curPage = prevPage;
                            } else {
                                renderCountries();
                            }
                        }
                    } else {
                        renderCountries();
                    }
            });
    });
});

但是，现在在delay()之后执行的函数被执行了两次。我不明白为什么会发生这一切，我想知道我该如何解决这个问题。

编辑: HTML

<table class="table table-striped table-responsive">
    <thead>
        <tr>
            <th>Name</th>
            <th>Continent</th>
            <th>Capital</th>
            <th>Language</th>
            <th>Population</th>
            <th>Currency</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
            <tr>
                <td>asdfdsaf</td>
                <td></td>
                <td></td>
                <td></td>
                <td>0</td>
                <td></td>
                <td>
                    <form method="POST" action="http://localhost:8000/country/all" accept-charset="UTF-8" class="pull-right"><input name="_token" value="l2LCeqGRZARM6YUR6hqTgoKWNRRxAUcwspf4kf1v" type="hidden">
                        <span class="glyphicon glyphicon-remove btn btn-xs btn-danger"></span>
                        <input name="id" value="1" type="hidden">
                    </form>
                </td>
            </tr>
    </tbody>
</table>