jquery ajax同步调用beforeSend

我有一个叫做的函数：

function callAjax(url, data) { $.ajax( { url: url, // same domain data: data, cache: false, async: false, // use sync results beforeSend: function() { // show loading indicator }, success: function() { // remove loading indicator } } ); } 

在代码中，我多次调用“callAjax”X次，我想同步更新数据。 它按预期完成，但有一个问题：loading项目没有显示在beforeSend函数中。 如果我将async变为true，它可以正常工作，但更新不会同步完成。

我尝试了几件事但没有成功。 我尝试将加载指示器放在ajax调用之前，如下所示：

 function callAjax(url, data) { // show loading div $.ajax( { // same as above } ); } 

但由于某种原因，它不想显示加载指标。 当我在beforeSend中输入“alert”并且在那种情况下出现加载指示符时，我注意到一种奇怪的行为，但我宁愿不弹出消息框。

有什么想法？

Answer 1

像这样进行同步调用就像放置一个“alert（）”框。 有些浏览器完全停止了他们正在做的事情，直到收到HTTP响应。

因此，在您的代码中，在您调用“$ .ajax（）”函数开始之后，在收到响应之前没有任何反应，而代码的下一步就是“成功”处理程序。

通常，除非您对服务器有信心，否则使用异步调用会更好。 当你这样做时，浏览器立即返回其工作，只是在后台监听HTTP响应。 当响应到达时，将调用您的成功处理程序。

Answer 2

当您执行阻塞I / O时，程序将停止，直到接收到输入，在执行同步调用时，JS语言中，程序停止并且浏览器窗口冻结（无法进行绘制），直到收到响应。 在大多数情况下，可以避免执行syncronus调用和任何类型的阻塞I / O. 但是想象一下你在java或任何其他编程语言中做进度条，你必须产生一个不同的线程来控制进度条，我想。

在你的情况下尝试的一件事是在延迟一段时间后调用ajax调用

 //loading div stuff, //if your doing some animation here make sure to have Sufficient //time for it. If its just a regular show then use a time delay of 100-200 setTimeout( ajaxCall, 500 ); 

在setTimeout中编辑 ajaxcall， 示例

Answer 3

这就是你要找的东西 – .ajaxStart（）

当任何ajax事件开始时它将被触发

http://api.jquery.com/ajaxStart/

他们甚至给出了一个类似于你想要完成的具体例子：

  $("#loading").ajaxStart(function(){ $(this).show(); }); 

然后，您可以使用.ajaxStop（）函数

 $("#loading").ajaxStop(function(){ $(this).hide(); });