jquery - 如何创建一个基本的 jquery 循环？

Question

我正在尝试创建一个简单的循环，该循环将循环播放并且可以停止和启动。

我试着这样称呼自己

var theloop = (function(){

            var theloop = (function(){

            $('#goldspot-2012 ul#goldspot-2012-list li').eq(currentItem).removeClass('current').fadeOut(500);
            $('#goldspot-2012 ul#goldspot-2012-list li').eq(currentItem+1).addClass('current').fadeIn(500);
            $('#gs-controls ul li').eq(currentItem).removeClass('current');             
            $('#gs-controls ul li').eq(currentItem+1).addClass('current');          

            if (currentItem == items -1){
                currentItem = 0;
                theloop();
            }

            else {
                currentItem++;  
                theloop();
            }



        });

这只是错误，因为我想象它陷入了一些无休止的循环

我也试过

var theloop = setInterval(function(){

            $('#goldspot-2012 ul#goldspot-2012-list li').eq(currentItem).removeClass('current').fadeOut(500);
            $('#gs-controls ul li').eq(currentItem).removeClass('current');                         

            if (currentItem == items -1){
                currentItem = 0;
            }

            else {
                currentItem++;  
            }
            $('#goldspot-2012 ul#goldspot-2012-list li').eq(currentItem).addClass('current').fadeIn(500);
            $('#gs-controls ul li').eq(currentItem).addClass('current');

        }, 5000);

但这不能轻易停止和开始。

任何人都可以向我展示一个基本循环，直到你停止它，或者上面两个中的一个可以稍微修补一下吗？

谢谢

Answer 1

尝试这个：

        var cycler = true;
        var theloop = (function(){

        $('#goldspot-2012 ul#goldspot-2012-list li').eq(currentItem).removeClass('current').fadeOut(500);
        $('#goldspot-2012 ul#goldspot-2012-list li').eq(currentItem+1).addClass('current').fadeIn(500);
        $('#gs-controls ul li').eq(currentItem).removeClass('current');             
        $('#gs-controls ul li').eq(currentItem+1).addClass('current');          

        if (currentItem == items -1){
            currentItem = 0;
        }

        else {
            currentItem++; 
        }

        if(cycler) theloop();

        });

这使您有机会停止无限循环。当您需要停止循环时，放置一些将循环器设置为false的按钮或代码。