Question

我有这个jQuery结构：

$(document).on('click', '.view-details', function () {   
    $(this).prop("disabled", true);
    // API call1
    // API call2
    // API call3
    $(this).prop("disabled", false);
}

我已经完成了此功能，并且可以阻止用户多次点击，这会导致多个问题。

这个问题是API调用是异步的，我不想让它们同步。

但是让它们Async会在我不想要的API调用之前执行Line5。在每个API成功和错误上启用它也是一项非常大的努力。

还有其他更好的建议，以确保在完成2,3,4后执行第5行？

Answer 1

你可以使用这样的东西：

$.when(api1, api2, api3).done(function(){});

Answer 2

您可以将AJAX调用返回的延迟对象放在一个数组中，然后将apply放到$.when，以便在所有请求完成后启用该按钮。试试这个：

$(document).on('click', '.view-details', function () {   
    var $el = $(this).prop("disabled", true);
    var requests = [];
    requests.push(request1);
    requests.push(request2);
    requests.push(request3);

    $.when.apply(requests).done(function() {
        $el.prop("disabled", false);
    });
});

禁用和启用html标记以防止多次点击

2 个答案: