Javascript 卡在一个简单的滑块上

好的，我想出了这个代码

<script type="text/javascript">
    $(document).ready(function(){
        var im1 = $("#slider li.first");
        function rev(){ 
            console.log('riv 1 is running now');
            im1.delay(500).animate({marginTop: "-170px"})
               .delay(500).animate({marginTop: "-340px"})
               .delay(500).animate({marginTop: "-510px"})
               .delay(500).animate({marginTop: "0px"}).trigger('stop');
        }

        im1.bind('stop',function(){
            console.log("rev is called on stop")
            rev();
        });

        console.log("rev is called the first time");
        rev();      
    });
</script>

$（文档）.ready（函数（）{
var im1=$（“#slider li.first”）；
函数rev（）{
log（'riv1正在运行'）；
im1.delay（500）.animate（{marginTop:“-170px”}）
.delay（500）.animate（{marginTop:“-340px”}）
.delay（500）.animate（{marginTop:“-510px”}）
.delay（500）.animate（{marginTop:“0px”}）.trigger（'stop'）；
}
im1.bind（'stop'，function（）{
console.log（“停止时调用rev”）
rev（）；
});
log（“第一次调用rev”）；
rev（）；
});

我要做的是，当文档准备就绪时，调用一个名为rev（）的函数。此函数的作用是启动一个动画，在滑块上滑动4个图像。当动画完成时，我触发一个名为“停止”的事件。 另一方面，我定义了一个事件处理程序，它跟踪stop事件并再次运行函数rev（）

这样做的问题是，当加载页面时，这些函数在启动动画之前运行数千次，当超过回调函数的限制时（大约在运行函数1709次之后），它会在控制台上显示错误 “未捕获范围错误：超过最大调用堆栈大小”

有更好的方法吗？

：

---

我已经解决了这个问题。我所要做的就是在上一个动画的回调中调用rev函数

代码如下所示

<script type="text/javascript">

        $(document).ready(function(){

        var im1 = $("#slider li.first");

        function rev(){ 
            console.log('riv 1 is running now');
            im1.delay(500).animate({marginTop: "-=170px"})
            .delay(500).animate({marginTop: "-=170px"})
            .delay(500).animate({marginTop: "-=170px"})
            .delay(500).animate({marginTop: "0px"},function stopped (){
                                                   rev();   
                           console.log(" played again! ")
                                   }
             );
        }

        console.log("rev is called for the first time");
        rev();      
        });
        </script>

$（文档）.ready（函数（）{
var im1=$（“#slider li.first”）；
函数rev（）{
log（'riv1正在运行'）；
im1.delay（500）.animate（{marginTop:'-=170px}）
.delay（500）.animate（{marginTop:'-=170px}）
.delay（500）.animate（{marginTop:'-=170px}）
.delay（500）.animate（{marginTop:“0px”}，函数已停止（）{
rev（）；
log（“再次播放！”）
}
);
}
console.log（“第一次调用rev”）；
rev（）；
});

如果其他人也有同样的问题，请使用相同的技巧