在beforeSend之后调用JQuery Ajax成功函数

Question

我有以下javascript:

function someFunction(string) {
    $.ajax({
        type: "GET",
        url: "some_endpoint_returning_json",
        async: false,
        data: "param=" + string,
        beforeSend: function() {
            $.blockUI({ message: '<h1><img src="static/busy.gif" /> Just a moment...</h1>' });
        },
        complete: function () {
            $.unblockUI();
         },
        dataType: "json",
        success: function(data) {
            window.alert(data.status);
        }
    });
}

我希望UI在发送ajax请求之前使用包含的消息进行阻止,然后删除消息,取消阻止ui,然后执行成功功能.

目前正在发生的事情:

1. UI阻止,但不显示消息
2. 弹出成功窗口警报
3. 在确认警报窗口后,BlockUI消息弹出一瞬间,然后UI解除阻塞,页面返回其初始状态

Answer 1

如果设置async为false,则在提供ajax请求时,浏览器将暂停所有内容的执行.虽然beforeSend在发送ajax请求之前执行,但同步请求可能发生得太快,以至于浏览器实际上不刷新屏幕并显示您的$.blockUI更改.在ajax完成后(当它们立即被删除时),您确实可以在很短的时间内看到它们.

如果必须使用异步,则可以通过$.blockUI单独调用并在启动ajax请求之前设置短暂超时(可能为100 MS)来解决此问题.