jQuery:为什么$ .ajax()在返回之前不等待请求完成？

Question

我只花了3个小时调试一些代码才发现它是由我假设下面代码的执行顺序是线性的: -

$.ajax( {ajax options} );
console.log('I was assuming this would execute once the ajax request was complete');

这不是第一次导致我出现问题,我只是想知道这种行为的原因是什么？

是否所有ajax请求都不会阻止可能与ajax请求无关的其他脚本执行？

Answer 1

大多数其他答案都在回答如何处理这个问题.我想非常简短地看一下为什么在这种情况下异步是好的.

实际上,大多数浏览器内的Javascript都是异步的.举个例子,这个代码:

document.getElementById('foo').onclick = function() {
    alert('foo clicked');
};
document.getElementById('bar').onclick = function() {
    alert('bar clicked');
};

哪个先运行？您不知道,因为浏览器模型固有的异步性(或实际上是大多数事件驱动的代码).您在事件发生时运行代码.您设置文档,然后等待事件发生,并且您的代码可以以各种不同的顺序执行,具体取决于首先发生的事件.Javascript代码需要在页面的整个生命周期内执行,而不仅仅是在第一次创建时.

因此,一般来说, Javascript编程(或者至少是超出最简单级别的Javascript编程)通常是异步的.此外,HTTP请求也是异步的很有意义.

首先,正如您所暗示的那样,使代码同步将阻止执行.也就是说,您可能不想让动画等待两秒钟,因为您正在进行两行的HTTP请求.服务器响应时间可能是(a)不规则和(b)缓慢,因此应用程序的设计依赖于服务器响应的速度是没有意义的.

其次,更重要的是,您的用户不会停止使用该页面,因为您的脚本正在进行AJAX调用.您的用户不在乎.您的用户可能会关心您的正常onscroll行为无法正常工作,因为您的脚本当前与无关的AJAX请求捆绑在一起.为了配合整个浏览器Javascript编程的异步性,绝大多数HTTP调用应该是非阻塞的,异步的.

Answer 2

因为ajax是异步的.如果你想在ajax调用成功时执行某些操作,请使用success事件

$.ajax({
  url: 'yourserverpage.php',
  success: function(data) {

    alert('This will be executed only when ajax call is success /finished');
  }
});

异步意味着什么？

异步I/O或非阻塞I/O是一种输入/输出处理形式,允许在传输完成之前继续其他处理.异步I/O用于提高吞吐量,延迟和/或响应能力.