多个ajax和layer.load()同时使用

最新推荐文章于 2022-08-15 15:05:23 发布

早退的程序员

最新推荐文章于 2022-08-15 15:05:23 发布

阅读量1.5k

点赞数 2

CC 4.0 BY-SA版权

文章标签： ajax load layer

本文链接：https://blog.youkuaiyun.com/qqnbsp/article/details/84323985

本文探讨了在进行多个AJAX请求时如何有效管理和优化，包括使用加载遮罩提升用户体验，确保请求异步以提高效率，以及通过计数、jQuery when()或全局变量等方法判断所有请求是否完成。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.多个ajax请求费时，需要添加load作为缓冲遮罩

2.ajax一定要都写成异步的 async:true

3.怎么确定所有的ajax都执行完毕：

方法如下：

方法一：添加一个计数，ajax请求完成后计数+1，并在每次请求完成后都判断计数是否为所有ajax的数量，满足就清除loading

(function () {
    var count = 0;
    var result = {};

    $.get(‘http://data1_source’, function (data) {
        result.data1 = data;
        count++;
        handle();
    });
    $.get(‘http://data2_source’, function (data) {
        result.data2 = data;
        count++;
        handle();
    });
    $.get(‘http://data3_source’, function (data) {
        result.data3 = data;
        count++;
        handle();
    });

function handle() {
    if (count === 3) {
    var html = fuck(result.data1, result.data2, result.data3);
    render(html);
    }
}
})();

方法二：一种是使用jquery自带的when

$.when(allProject(),brand(),pieChart(),lineCharts(),initTable()).done(function(a1,  a2){
   alert(333);
});

方法三：设置全局变量

var ajaxCount = 10 ;
var ajaxFinished = function(){
if(ajaxCount > 0){// do nothing}
else{
// 请求全部完成，做该做的事情
}
}

$.ajax(xxx1).then(function(){
ajaxCount --;
ajaxFinished();
});
$.ajax(xxx2).then(function(){
ajaxCount --;
ajaxFinished();
})