javascript - AJAX 调用阻止对话框显示

Question

我有一个对某些服务的同步 ajax 调用。

我想首先显示一个对话框(在我的例子中它是一个extjs窗口...但这不是重点。简单的alert(. .) )。

然后在显示对话框后我想立即调用 ajax 调用，这需要大约 30 秒才能完成。但是，该对话框仅在 ajax 调用运行完成后(即 30 秒内)显示。我什至尝试将其设置为超时，但这并没有改变任何东西。

Util.logInfo('1. before popup')

setTimeout(function(){alert("Hello")},1000); //some kind of GUI action

Util.logInfo('2. after popup')

var self = this;

var call = {}

call.url = url;
call.xmlHttpReq = $.ajax({
    url: 'somewebserviceURLthattakesaloooongtime',
    dataType: 'json',
    async: false,
    type: 'GET'
}).always(function (processedDataOrXHRWrapper, textStatus, xhrWrapperOrErrorThrown) {
    self.data = processedDataOrXHRWrapper;
});

Util.logInfo('3. after ajax')

这是 jQuery ajax 功能的一个特殊问题，还是我错过了一些基本的东西关于ajax如何工作？

来自 Java 背景，这几乎就像正在进行某种事件调度线程事件。

Answer 1

设置async: false将阻止进一步的脚本运行(或完全锁定网站)，直到您的ajax完成

在此处查看更多信息What does "async: false" do in jQuery.ajax()?

From the documentation

[...] By default, all requests are sent asynchronously (i.e. this is set to true by default). If you need synchronous requests, set this option to false. Cross-domain requests and dataType: "jsonp" requests do not support synchronous operation. Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active. [...]

只需删除该行即可解决您的问题。