按次序执行ajax的方法

按次序执行ajax的方法
我们写的前台页面可能要多次和后台交互，页面在初始化的时候需要多次提交ajax请求，列如多个报表的查询，但系统每次查询可能消耗大量的时间，为减轻服务器压力我们需要按次序执行ajax请求，ajax是个异步请求，我们不能简单的for循环请求数据，而必须等待上一个请求返回的时候的再进行下一个请求。

<script type="text/javascript">

var ajaxArr = [];
var begin = true;

//这是个获取ajax方法的封装
var getAjax = function (post, fback) {

    if (begin)
        ajaxArr.push({ post: post, fback: fback });
    else

        setTimeout(function () {
            $.ajax({
                url: '/Default/GetInnerTest',
                data: post,
                dataType: 'json',
                success: function (data) {
                    if (fback)
                        fback(data)
                }
            });
        }, 3000);

}

var loadData = function () {

    //为了顺序不变，重新生成个数组
    var ajaxArr2 = [];
    var length = ajaxArr.length;

    for (var i = 0; i < length; i++)
        ajaxArr2.push(ajaxArr.pop());

    //取第一个请求
    var one = ajaxArr2.pop();
    var tmpFn = one.fback;

    //将请求完成的回调函数重写，以至于该回调会自动执行下次请求
    var fn2 = one.fback = function (data) {
        //执行原始回调函数
        tmpFn(data);
        //执行下一个
        if (ajaxArr2.length > 0) {
            //先取出一个保留原始回调，重新设置新回调
            one = ajaxArr2.pop();
            tmpFn = one.fback;
            one.fback = fn2;
            //执行下一个请求
            getAjax(one.post, one.fback);
        }
    }
    //将真正的ajax回调开关打开执行第一个
    begin = false;
    getAjax(one.post, one.fback);
}


$(document).ready(function () {

    var params = {};

    getAjax(JSON.stringify(params), function (data) { alert(data.msg); });
    getAjax(JSON.stringify(params), function (data) { alert(data.msg); });
    getAjax(JSON.stringify(params), function (data) { alert(data.msg); });
    getAjax(JSON.stringify(params), function (data) { alert(data.msg); });

    loadData();
});
</script>