用jq发送多个ajax然后执行回调的小技巧

来源：动视网责编：小采时间：2020-11-27 20:01:33

用jq发送多个ajax然后执行回调的小技巧

用jq发送多个ajax然后执行回调的小技巧:这次给大家带来用jq发送多个ajax然后执行回调的小技巧，用jq发送多个ajax然后执行回调的注意事项有哪些，下面就是实战案例，一起来看一下。推荐axios.jsAxios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。从浏览器中创建 XMLH

推荐度：

点击下载本文 文档为doc格式

导读用jq发送多个ajax然后执行回调的小技巧:这次给大家带来用jq发送多个ajax然后执行回调的小技巧，用jq发送多个ajax然后执行回调的注意事项有哪些，下面就是实战案例，一起来看一下。推荐axios.jsAxios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。从浏览器中创建 XMLH

这次给大家带来用jq发送多个ajax然后执行回调的小技巧，用jq发送多个ajax然后执行回调的注意事项有哪些，下面就是实战案例，一起来看一下。

推荐axios.js
Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。

从浏览器中创建 XMLHttpRequests

从 node.js 创建 http请求

支持PromiseAPI

拦截请求和响应

转换请求数据和响应数据

取消请求

自动转换 JSON 数据

客户端支持防御XSRF

下文是基于jquery的代码非axios.js代码。

本人测试有效，如果有人用下面的方法还是行不通，可以在下面评论中说明。Axios.js是一个基于 promise 的 HTTP 库，建议大家到npm上浏览一下Axios.js，中文版传送门，以下的内容不重要。。

这需求我见过的有两种解决方法：
（个人觉得还是第一种方法好些）

1.第一种是计数法，它需要在外面声明一个能够让每个回调访问到的变量，在每个请求成功的回调函数里将此变量加1，如果变量加到最大就执行回调，但是需要在每个请求成功的回调函数里做判断。

特点：由于ajax本来就是异步的，所以每个ajax彼此互不干扰，不必按照顺序一个接着一个加载，相对下面第二种总请求时间更短。

计数法的demo

function countAjax(arr,cb) { var len = arr.length,
 result = [],
 count = 0; for(let i=0; i<len; i++) {
 $.ajax({ type: arr[i].type, url: arr[i].url, success: function(res){
 count++;
 result[i] = res; console.log("第" + ( i + 1 ) + "个ajax回调函数 " + res); if( count == len ) {
 cb(result);
 }
 }
 });
 }
}var arr = [{ url: "keepWords", type: "get"},{ url: "xx", type: "get"},{ url:"yy", type: "get"}];
countAjax(arr,function(result){ console.log("all of ajax is done",result);
});

亲测有效，在服务器那头可以setTimeout模拟网络延迟
提示，如果有人用下面的方法还是行不通，可以在下面评论中说明！

2.第二种是利用promise，在上一个请求完事之后，发送下一个请求。
特点：每个ajax都要排队按顺序请求和响应，需要在上一个请求响应成功之后再进行下一个请求，是一个接着一个的。

promise的demo

function orderAjax(arr,cb) { var promise,
 result = []; for(let i=0,len=arr.length; i<len; i++) { if(!promise) {
 promise = $.ajax({ url: arr[i].url, type: arr[i].type
 });
 }else {
 promise = promise.then(function(res) {
 result.push(res); console.log("第" + ( i ) + "个ajax回调函数 " + res); return $.ajax({ url: arr[i].url, type: arr[i].type
 });
 })
 }
 }
 promise.then(function(res){
 result.push(res); console.log("第" + ( arr.length ) + "个ajax回调函数 " + res);
 cb(result);
 });
}var arr = [{ url: "keepWords", type: "get"},{ url: "xx", type: "get"},{ url:"yy", type: "get"}];
orderAjax(arr,function(result) { console.log('all of ajax is done',result);
})

亲测有效，在服务器那头可以setTimeout模拟网络延迟
提示，如果有人用下面的方法还是行不通，可以在下面评论中说明！
另外强推荐axios.js
Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！

用jq发送多个ajax然后执行回调的小技巧

推荐度：

点击下载本文 文档为doc格式

标签：发送多个回调

热门焦点

用jq发送多个ajax然后执行回调的小技巧

用jq发送多个ajax然后执行回调的小技巧

用jq发送多个ajax然后执行回调的小技巧

最新推荐

猜你喜欢

热门推荐