Question

我有一个名为particleAppear的JS函数，它是一个循环：

var particles = new Array("pt0","pt1","pt2","pt3");

function particleAppear(){
    var genPoint = Math.floor(Math.random() * (720 - 4 + 1)) + 4;
    var particle = particles[Math.floor(Math.random()*particles.length)];

    $('#particles').append('<div class="'+particle+'" style="position: absolute; top: '+genPoint+'px; left: -4px"></div>');

    var rtime1 = Math.floor(Math.random() * (42000 - 32000 + 1)) + 32000;
    var rtime2 = Math.floor(Math.random() * (42000 - 32000 + 1)) + 32000;
    var rtime3 = Math.floor(Math.random() * (42000 - 32000 + 1)) + 32000;
    var rtime4 = Math.floor(Math.random() * (42000 - 32000 + 1)) + 32000;

    $('.pt0').animate({left: '+=1280px'}, rtime1, "linear",function(){
        $(this).remove();
    });
    $('.pt1').animate({left: '+=1280px'}, rtime2, "linear",function(){
        $(this).remove();
    });
    $('.pt2').animate({left: '+=1280px'}, rtime3, "linear",function(){
        $(this).remove();
    });
    $('.pt3').animate({left: '+=1280px'}, rtime4, "linear",function(){
        $(this).remove();
    });

    var randomTimeGen = Math.floor(Math.random() * (1500 - 450 + 1)) + 450;
    setTimeout(particleAppear,randomTimeGen);
}

正如您所看到的，使用的循环不是setInterval，而是setTimeout，它会在450到1500ms之间的随机时间之后重新运行该函数。如何使用JAVASCRIPT / JQUERY停止此操作？

Answer 1

您可以将超时的数字ID存储在变量中并清除它：

var timeout = setTimeout(particleAppear,randomTimeGen);

clearTimeout(timeout);

Answer 2

使用clearTimeout()。

在函数之外创建一个变量：

var timeout;

在你的功能中

timeout = setTimeout(particleAppear,randomTimeGen);

在您的代码的其他地方，您可以致电：

clearTimeout(timeout);

Answer 3

您可以停止运行该功能，就像停止使用setInterval

运行的功能一样

var timeout;
function particleAppear(){
    /* ... */
    timeout = setTimeout(particleAppear, randomTimeGen)
}

// Somewhere else
clearInterval(timeout);

停止没有间隔的功能循环

3 个答案: