ajax中的async
2018-10-20 本文已影响1人
siberiawolf0307
今天写一个ajax的时候,需要等待ajax处理结果。我第一时间想到的是es6的新语法,因为以前看过代码,但是没在项目中用过,看了一会儿,感觉自己走麻烦了。其实直接用ajax的async属性就行。因为一般情况下这个属性不用设置,就给忽略了。
async值为true (异步)
这个属性一般默认是true,甚至可以不写这个属性,在一般的框架中都会有默认值。
当ajax发送请求后,在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到server端返回正确的结果才会去执行success,也就是说这时候执行的是两个线程,ajax块发出请求后一个线程 和ajax块后面的脚本(另一个线程)
$.ajax({
type: 'POST',
url: 'getUserName',
dataType: 'json',
success: function(result){ // function1()
console.log('do something');
},
error: function (xhr, type) {
console.log(xhr);
}
});
function2(); // function2()
在上例中,当ajax块发出请求后,他将停留function1(),等待server端的返回,但同时(在这个等待过程中),前台会去执行function2()。
async值为false (同步)
将这个属性手动设置为false。
当执行当前AJAX的时候会停止执行后面的JS代码,直到AJAX执行完毕后时,才能继续执行后面的JS代码。
$.ajax({
type: 'POST',
url: 'getUserName',
dataType: 'json',
async: false,
success: function(result){ // function1()
console.log('do something');
},
error: function (xhr, type) {
console.log(xhr);
}
});
function2(); // function2()
当把asyn设为false时,这时ajax的请求时同步的,也就是说,这个时候ajax块发出请求后,他会等待在function1()这个地方,不会去执行function2(),直到function1()部分执行完毕。
总结:简单的东西,长时间不使用,冷不丁一下子也是会忘记的。