es5中判断多个ajax全部执行完成后进行回调

23次阅读

共计 1798 个字符,预计需要花费 5 分钟才能阅读完成。

$.when() jQuery 中的 api

$.when($.ajax({
url: url,
dataType: “jsonp”,
data: {“movieId”: 248906},
success: function(data) {
var data = data.data.data;
var actorList = data.stars.split(‘,’).join(‘ | ‘);
var type = data.category.split(‘,’).join(‘ | ‘);
result.push({
“actorList”: actorList,
“type”: type
})
},
error: function(err) {
console.log(err)
}
}), $.ajax({
url: url,
dataType: “jsonp”,
data: {“movieId”: 1212492},
success: function(data) {
var data = data.data.data;
var actorList = data.stars.split(‘,’).join(‘ | ‘);
var type = data.category.split(‘,’).join(‘ | ‘);
result.push({
“actorList”: actorList,
“type”: type
})
},
error: function(err) {
console.log(err)
}
}), $.ajax({
url: url,
dataType: “jsonp”,
data: {“movieId”: 346765},
success: function(data) {
var data = data.data.data;
var actorList = data.stars.split(‘,’).join(‘ | ‘);
var type = data.category.split(‘,’).join(‘ | ‘);
result.push({
“actorList”: actorList,
“type”: type
})
},
error: function(err) {
console.log(err)
}
})).done(function() {
console.log(result)
})

全局变量判断
var ajax_done_count = 0;
function ajax_done() {
if(ajax_done_count === 3) {
// 渲染页面
} else {
// 什么都不做
}
}

$.ajax({success: function(data) {
ajax_done_count += 1;
ajax_done();
}})
$.ajax({success: function(data) {
ajax_done_count += 1;
ajax_done();
}})
$.ajax({success: function(data) {
ajax_done_count += 1;
ajax_done();
}})

promise.all
貌似在 es5 中也支持 promise 了 …
我写了一个 demo

var url = ‘http://xxx/xxx’;
var idList = [248906, 1212492, 346765, 341139];
var result = [];
var promiseArr = [];

function createPromise (id) {
return new Promise(function(resolve, reject) {
$.ajax({
url: url,
dataType: “jsonp”,
data: {“movieId”: id},
success: function(data) {
var data = data.data.data;
resolve({
“actorList”: data.stars,
“type”: data.category
});
},
error: function(err) {
reject(err);
}
})
})
}

idList.map(function(i) {
promiseArr.push(createPromise(i))
})

console.log(promiseArr)

Promise.all(promiseArr).then(function(data) {
result = data;
console.log(result);
// 渲染页面
}).catch(function(err) {
console.log(err);
})

正文完
 0