Question

var switchTabs = function(index, el) {
            //alert("Call SwitchTabs");

            ribbon.slideTo(index);
            ribbon.currentSlideIndex = parseInt(index, 10);

            //console.log(ribbon.currentSlideIndex);

            dojo.query('.ibm-slider-wrapper #ibm-thumb-slider-tabs li.ibm-active').removeClass('ibm-active');
            dojo.query(el).addClass('ibm-active');      //applies class to current active li
            //fixTabHeight(index == 4);
        }

自动滚动的以下部分运行并且不会一次停止1个索引。它直接跳到6，所以我的滑块从0移动到第6位。我想让它在8秒后一次移动1次。

如何让它停止每个索引并运行swapTabs（a，b）;然后在autoScroll？

中触发索引变量的增量

我尝试使用setInterval（）但它仍然按照我想要的方式运行。理想情况下，我想为每个索引使用Switch语句并在setInterval中触发swapTabs，这样我就可以管理单个索引键的计时器。任何帮助都非常感谢。

var autoScroll = function(){            
            //alert("Inside AutoScroll");
            //var tabCount = $('.ibm-slider-wrapper #ibm-thumb-slider-tabs li');
                for(var i = 0; i < 6; i++) {
                    var tabsIndex = $('.ibm-slider-wrapper #ibm-thumb-slider-tabs li a');
                        switchTabs(parseInt(tabsIndex[i].getAttribute('rel'), 10), tabsIndex[i].parentNode);
                        console.log(tabsIndex[i]);
                    }
        }   

        autoScroll();

Answer 1

使用setTimeout并让函数自行调用：

var i = 0, interval = 8000, iterations = 6;

var autoScroll = function(){

    // function body here

    i++;
    console.log("Iteration #" + i);
    if (i < iterations) {
        setTimeout(autoScroll, interval);
    }  
}   

// start first run
autoScroll();

Answer 2

您的代码快速连续地从索引0到5（在彼此的ms内），并且在脚本在索引6上完成之前，浏览器可能不会显示任何内容。

如果您希望它停止并显示每个标签，那么您需要使用setTimeout()之类的内容，并在每次定时器触发时前进一个标签。

 (function() {
     var indexCntr = 0;
     var tabsIndex = $('.ibm-slider-wrapper #ibm-thumb-slider-tabs li a');
     function autoScroll() {
         if (indexCntr < 6) {
             switchTabs(parseInt(tabsIndex[index].getAttribute('rel'), 10), tabsIndex[i].parentNode);
             ++indexCntr;
             setTimeout(autoScroll, 5000);   // set the proper delay time here
         }
      }   

      autoScroll();
 })();

for循环不会在每个索引处停止

2 个答案: