Javascript 设置间隔&；全局范围：单击一次运行setInterval

当用户登陆我的主页时，我使用setInterval循环浏览一些类以获得视觉效果：

    var toggleSlide = setInterval( function() {
      $('#cs-main nav li.cycle').removeClass("cycle" || " ").next().last().addClass("cycle");
},600);

我希望此效果仅在用户单击初始页面时运行一次，并且站点通过ajax加载：

    $("#splash").live('click', function () {
        $(this).fadeOut('slow', function () {
            $('#main').load('client.html', function () {
            }).fadeIn();

            var toggleSlide = setInterval( function() {
      $('#cs-main nav li.cycle').removeClass("cycle" || " ").next().last().addClass("cycle");
},600);

        });
        return false;
    });

我遇到的问题是（我假设）因为setInterval在全局范围内运行，任何时候

#cs main nav li.cycle

出现在页面上，setInterval都会执行它的操作。这是有问题的，因为这个类出现在我的子页面上，而我的目的只是让它在用户单击#splash时运行一次。

使用

clearInterval（）

在完成计时器后杀死它

试试下面的方法

$("#splash").live('click', function () {
    $(this).fadeOut('slow', function () {

        var toggleSlide = setInterval( function() {
            $('#cs-main nav li.cycle').removeClass("cycle" || " ").next().last().addClass("cycle");
        },600);

        $('#main').load('client.html', function () {
        }).fadeIn('slow', function(){
            clearInterval(toggleSlide);
        });



    });
    return false;
});

---

setTimeout

和

setInterval

函数不在全局范围内执行；它们在新的执行上下文中运行。谢谢，看起来clearInterval在完成之前就停止了toggleSlide。是的，一旦内容淡入，上面的代码就会停止“toggleSlide”。您可以将“clearInterval”移动到范围内您知道效果已完成的任何位置。