setInterval＆amp;全局范围：单击时运行setInterval一次

Question

当用户登陆我的主页时，我使用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时运行一次。

Answer 1

完成后，使用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;
});