如何在 JavaScript 中停止'setTimeout”循环？

如何控制 setTimeout 循环的执行

您正在尝试使用精灵图像创建加载指示器，并且遇到了加载完成后停止循环的问题。您提供的函数启动一个 setTimeout 循环，该循环以指定的时间间隔迭代值数组。挑战在于以编程方式停止此循环。

要解决此问题，您可以利用 setTimeout 返回的计时器句柄。随后，您可以使用clearTimeout来停止超时操作。

这是包含此技术的代码的修改版本：

function setBgPosition() {
    var c = 0,
        timer = 0;
    var numbers = [0, -120, -240, -360, -480, -600, -720];
    function run() {
        Ext.get('common-spinner').setStyle('background-position', numbers[c++] + 'px 0px');
        if (c >= numbers.length) {
            c = 0;
        }
        timer = setTimeout(run, 200);
    }
    timer = setTimeout(run, 200);

    return stop;

    function stop() {
        if (timer) {
            clearTimeout(timer);
            timer = 0;
        }
    }
}

var stop = setBgPosition();
// ...later, when you're ready to stop...
stop();

通过将计时器句柄分配给计时器变量，您可以加载完成后使用clearTimeout引用并清除它。

此外，值得考虑使用setInterval而不是setTimeout在需要重复执行的场景中。这可以简化代码并提供更健壮的解决方案。

请记住在 setBgPosition 本身中实现适当的机制，以检测循环何时应终止，以确保独立且自主的功能。

以上是如何在 JavaScript 中停止'setTimeout”循环？的详细内容。更多信息请关注PHP中文网其他相关文章！