想实现一个进度条动态更新

想实现一个进度条动态更新:在for中循环一个ajax,若是同步,页面卡死,等所有ajax执行完毕后,进度条直接到达100%,如果异步,会先执行for循环,导致我的暂停不能使用,想要的效果是每循环一次,ajax执行一次,回调函数执行一次

function updata(){
        var ajax = new $ax(Feng.ctxPath + "/device/oriDataByYear", function (data) {
            for(var key in data){
                var tableName = data[key][0];
                var startTime = data[key][1];
                var endTime = data[key][2];
                var num = data[key][3];
                var count = Math.floor(num/100);
                total += parseInt(num);
                for(let j = 0; j <= count; j++){
                                    if(start){
                    aj3(tableName,startTime,endTime,j,start);
                                        }
                                }
            }
        });
        ajax.set('tableid',$("#tableid").val());
        ajax.set('startTime',$("#startTime").val());
        ajax.set('endTime',$("#endTime").val());
        ajax.start();
    }
    //单张表更新历史数据
    function aj3(tableName,startTime,endTime,j,start){
        if (start == true) {
            $.ajax({
            type: 'get',
            url: Feng.ctxPath + "/device/getDataByTableId",
            data: {
                "startTime": startTime,
                "tableName": tableName,
                "endTime": endTime,
                "num": j * 100,
                "formula": $("#formula").val(),
            },
            async: true,
            success: function (da) {
                init(da)
            }
            });
        }
    }

    //更新进度条
    function init(da){
        flag += da;
        element.progress('demo', Math.floor((flag / total) * 100) + '%');
        if (flag >= total) {
            $("#end").show();
            $("#stop").hide();
            Feng.success("历史数据更新成功!");
        }
    }
        //暂停
        $("#stop").click(function () {
        start = false;
        $("#end").html("退出");
        $("#end").show();
        $("#stop").hide();
    });

2个回答

这么看来可以试试用同步方式,但是需要将后面的暂停绑定事件挪到前面先执行。

weixin_43961593
迟震宇 同样点击暂停前进度条不懂,点击后进度条直接前进到暂停时的进度
11 个月之前 回复
weixin_43961593
迟震宇 同步的话可以实现暂停,但是同步回调函数不会执行,等循环完所有的aj3,才会执行回调函数,导致进度条会从0直接到达100%
11 个月之前 回复
weixin_43961593
迟震宇 同步的话可以实现暂停,但是同步回调函数不会执行,等循环完所有的安静
11 个月之前 回复

jq里面不是有个定时方法吗?setTimeout

weixin_43961593
迟震宇 数据量较小的时候,for循环的速度一定快于你点击按钮的速度,没等到点击按钮,已经循环完毕了
11 个月之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问