javascript - 我只需要在 javascript 中运行特定代码 3 次

Question

我需要用 jquery 为滑动设置动画。但只有 3 次。我写了这段代码。但这超过了3次。请帮助我修复或提供不同的代码。提前致谢。

$(document).ready (function () {
    var i=0;
    while (i<3) {                    
        $('a.nextbtn').click (function () {
            $('ul.post-cat-sliding').stop().animate({"left": "-=596"},1500);
        });
        i++;
    }
});

而且我有上一个按钮.. 所以如果我点击上一个按钮幻灯片应该返回。

Answer 1

使用您当前的代码，您实际上是在一个按钮上附加了 3 个单击事件，而不是将其限制为三个单击。因此，使用当前代码，我认为您的滑块将一键通过 3 张幻灯片。

试试下面的代码：

$(document).ready (function () {
   var i=0;
   $('a.nextbtn').click (function () {
      if(i < 3) {
         $('ul.post-cat-sliding').stop().animate({"left": "-=596"},1500);
         i++;
      }
   });
});

Answer 2

for(var i = 0; i < 3; i++)可能似乎有点过于冗长。

也许您可能喜欢其中一些方法：

for(i in [1,2,3]){
    console.log('three times')
}

或者

for(i in new Array(3).fill()){
    console.log('three times')
}

或者

for(i in '...'.split('')){
    console.log('three times')
}

Answer 3

我会改用 for 循环：

$(document).ready(function(){
    $('a.nextbtn').click (function(){
        for(var i = 0; i<3;i++)
        {
            $('ul.post-cat-sliding').stop().animate({"left": "-=596"},1500);
        }
    });
});

编辑：当我阅读这篇文章时，只关心循环。如果您希望动画在单击 nextbtn 时运行 3 次，您应该使用上面的代码。您可以重用代码a.prevbtn