如果索引包含要迭代的内部数组，如何停止数组迭代，然后继续答案

【问题标题】：how to stop an array iteration if an index contains an inner array to iterate, then continue如果索引包含要迭代的内部数组，如何停止数组迭代，然后继续
【发布时间】：2013-06-14 20:14:39
【问题描述】：

我想遍历一个数组，将每个数组淡入然后淡出。但是，如果该数组中的索引应该包含它自己的数组，我希望外部数组停止；然后动画它的内部数组；然后继续。

我已经提供了jsfiddle

我知道它现在是各种意大利面条，但我打算把它变成一个函数，在 if 语句中调用另一个函数。但是现在我对如何让它正确停止有点困惑。

$(document).ready(function() {

// start
var elements = $('.switch');

elements.each(function(index) {
    var element = $(this);

    setTimeout(function() {
        element.fadeIn(1000, function() {

            if(element.has('.section')){

                var innerEls = $('.section');
                innerEls.each(function(i) {
                    // stuff
                    var inner = $(this);
                    setTimeout(function() {
                        element.stop();
                        inner.fadeIn(1000).delay(2000).fadeOut(1000);
                    }, 4000 * i);
                });
            }

        }).delay(1000).fadeOut(1000);
    }, 2000 * index);

});

});

<div class="switch">This is &lt;div&gt; number 1</div>
<div class="switch">This is &lt;div&gt; number 2</div>
<div class="switch">This is &lt;div&gt; number 3 
    <div class="section">this</div>
    <div class="section">needs to</div>
    <div class="section">show</div>
</div>
<div class="switch">This is &lt;div&gt; number 4</div>
<div class="switch">This is &lt;div&gt; number 5</div>

【问题讨论】：

你应该使用setInterval 而不是for each : setTimeout 并在每个间隔为您的元素设置动画并找到下一个要设置动画的元素。这样您就可以在不破坏时序的情况下通过内部数组进行动画处理。

标签： jquery loops multidimensional-array continue

【解决方案1】：

你可以的

switchelements(elements);

function switchelements(e){
    e.eq(0).delay(1000).fadeIn(1000,function(){
        if($(this).children(".section").length>0){
             var inner=$(this).children(".section");
             switchelements(inner);
        }
        else{
            $(this).delay(1000).fadeOut(1000,function(){
                if(e.length>=2){
                    e.splice(0,1);
                    switchelements(e);
                }else{
                    if($(this).parent(".switch").next("switch")){
                        $(this).parent(".switch").delay(1000).fadeOut(1000,function(){
                            switchelements($(this).nextAll(".switch"));
                        });
                    }
                }
            });
        }
    });   
}

http://jsfiddle.net/x2s8P/3/

【讨论】：