一、ajax嵌套
ajax嵌套ajax。跟疯狂for循环一样,这种方式只能串行发起ajax请求。弊端也很明显,随着ajax请求次数增加,嵌套层数也逐渐加深,代码很难维护。而且,效率也不高。
function getData(){ $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data1){ $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data2){ $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data3){ console.log(data1); console.log(data2); console.log(data3); } }) } }) } }) }
二、设置一个全局变量
所有ajax接口都可以同时发起请求,而且代码分离,在每个ajax的callback都统一回调一个函数,由这个函数来判断全局变量是否达到条件。
function getData(){ var flag = 0, _data1, _data2, _data3; $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data1){ flag++; _data1 = data1; if(flag == 3){ //do something } } }) $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data2){ flag++; _data2 = data2; if(flag == 3){ //do something } } }) $.ajax({url: "/something",type:'GET',dataType:'json',success: function(data3){ flag++; _data3 = data3; if(flag == 3){ //do something } } }) }
三、使用jquery的$.when()方法,就是promise模式,让异步请求方式变为链式调用,以及能做到并行请求
如果所有请求成功返回,then方法里第一个回调执行,如果任意一个请求失败,则执行第二个回调。
function getData(){ var fun1 = $.ajax({url: "/something",type:'GET',dataType:'json'}), fun2 = $.ajax({url: "/something",type:'GET',dataType:'json'}), fun3 = $.ajax({url: "/something",type:'GET',dataType:'json'}); $.when(fun1,fun2,fun3).then(function(data1,data2,data3){ //成功回调,所有请求正确返回时调用 console.log(data1); console.log(data2); console.log(data3); },function(){ //失败回调,任意一个请求失败时返回 console.log('error'); }) }
本文作者为南知唔知,转载请注明。