进度条超过100

时间:2019-12-30 11:39:13

标签: javascript ajax

我的一个网页上有一个进度栏。我对这个进度条的问题是,如果后台进程花费的时间比预期的长一些,它将继续前进并超过100%,甚至超出范围。

我使用文件中的元素检查并查看进度条的每个条件是否可用,然后相应地更新进度。这一切都很好,但是无论我做什么,我仍然不能告诉进度栏停止超过100%。我当然是新来的。 你能帮我解决这个问题吗?我已经尝试修复了几个小时。

仅供参考:后端是使用Django和python编写的。

这是我的代码:

$(document).ready(function grabber() {
        elem = document.getElementById("progress_bar_inner");
        width = 1;
        interval = setInterval(ajaxcall, 400);
        var i;
        finished = [];
        addition = 0.3;
    });
    var ajaxcall = function getstatus () {
        $("#progressText").text((width).toFixed(1) + '%');
        $("#progress_bar_inner:after").css('content' , width+'%');
        if (width >= 80 && finished.length <= 8){
            //alert('condition triggered')
            addition = 0.15;
        }
        width+=addition;
        elem.style.width = width + '%';
        $.getJSON("/some-address/status/{{some-id}}", function(data){
            //console.log(data);
            for (var i in data){
                if(data[i]){
                console.log(i);
                if (!finished.includes(i)){
                    $('#'+i).addClass('active');
                    finished.push(i);
                    //console.log(finished);
                    if (width < finished.length/10*100){
                    width = finished.length/10*100;
                    }
                    if (finished.length === 10){
                    //alert('se finiiiiiiiiiiii');
                    width = 100;
                    elem.style.width = '%'+width;
                    $("#progress_bar_inner:after").css('content' , '%'+width);
                    $("#progressText").text('%'+(width).toFixed(1));
                    console.log(data);
                    clearInterval(interval);
                    window.location.replace("{% url "go-to-result-page" some-id %}");
                    }
                }
                }
            }
        });
    }

0 个答案:

没有答案