javascript - 在 JavaScript for 循环中休眠

标签 javascript loops for-loop sleep

我正在尝试创建一个每 1 秒更新一次的计数器。我制作了一个每 30 秒返回一次的后端函数,它是通过 Ajax 调用的。调用结果除以 30,然后应在 30 秒内每 1 秒更新一次计数器。我该如何在 for 循环中添加 sleep ?

这是我到目前为止的代码:

function getCount() {
    $.ajax({
        url: '@Url.Action("", "", new {area = ""})',
        type: 'POST',
        success: function (data) {
            var newTotalCount = data.totalCount;
            var newDanishCount = data.danishCount;
            var newNorwayCount = data.norwayCount;
            var newSwedenCount = data.swedenCount;
            var newUsCount = data.usCount;

            var currentTotalCount = $("#odoTotal").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
            var currentDanishCount = $("#odoDk").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
            var currentNorwayCount = $("#odoNo").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
            var currentSwedenCount = $("#odoSe").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
            var currentUsCount = $("#odoUs").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");

            var updateTotalCount = newTotalCount - currentTotalCount;
            var updateDanishCount = newDanishCount - currentDanishCount;
            var updateNorwayCount = newNorwayCount - currentNorwayCount;
            var updateSwedenCount = newSwedenCount - currentSwedenCount;
            var updateUsCount = newUsCount - currentUsCount;

            var updateTotalPerSecond = updateTotalCount / 30;
            var updateDanishPerSecond = updateDanishCount / 30;
            var updateNorwayPerSecond = updateNorwayCount / 30;
            var updateSwedenPerSecond = updateSwedenCount / 30;
            var updateUsPerSecond = updateUsCount / 30;


            getAllSales();

            for (var i = 0; i < 30; i++) {
                window.setTimeout(function() {
                    $("#odoTotal").html(currentTotalCount+updateTotalPerSecond);

                    $("#odoDk").html(currentDanishCount+updateDanishPerSecond);

                    $("#odoNo").html(currentNorwayCount+updateNorwayPerSecond);

                    $("#odoSe").html(currentSwedenCount+updateSwedenPerSecond);

                    $("#odoUs").html(currentUsCount+updateUsPerSecond);

                    currentTotalCount = $("#odoTotal").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
                    currentDanishCount = $("#odoDk").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
                    currentNorwayCount = $("#odoNo").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
                    currentSwedenCount = $("#odoSe").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");
                    currentUsCount = $("#odoUs").text().replace(/,/g, "").replace(/(\r\n|\n|\r)/gm, "");


                }, 1000);

            }

        }
    });

}

最佳答案

我有一个解决方案

首先创建一个要递增的变量

var x = 0;

然后创建一个间隔,该间隔将在时间结束后执行您想要的操作,例如 5(s),这也会在每次运行时增加您的值 x

var interval = setInterval(function() {
    if (x >= 5) { // just change 5 to 30
        console.log('Loop timeout ended');
        return clearInterval(interval);
    }
    // do what ever you want
    console.log('Current x: '+x);
    x++;
}, 5000); 

示例函数

function runTimeoutLoop(){
    var x = 0;
    var interval = setInterval(function() {
        if (x >= 5) { // just change 5 to 30
            console.log('Loop timeout ended');
            return clearInterval(interval);
        }
        // do what ever you want
        console.log('Current x: '+x);
        x++;
    }, 5000); 

}

Demo

关于javascript - 在 JavaScript for 循环中休眠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41297730/

相关文章:

javascript - 遍历复杂的嵌套 json 数组 javascript

c++ - 如何在 C++ 中循环语句

r - For() 循环查找其他日期之间的 ID 日期并计算平均值

java - 计算数字中不重复的数字

Javascript,更改整个 iframe 页面

javascript - 尽管查询字符串中有 grant_type,Microsoft Graph API 返回 404 错误缺少参数

javascript - 预编译时未找到 javascript 资源中的路由辅助方法

Javascript - 如何在 html 页面上显示下周三的日期

Java - Apache POI - 使用循环填充行和单元格时遇到问题(Excel)

Python - 从嵌套循环中跳出内部循环