jquery - Jquery循环问题，在下一个循环之前完成任务

Question

我正在运行一个简单的循环：

    var c=0;

while(c<count){
    theimg = $container.find('.img'+c+'');

    $thisX = theimg.css('top');

    theimg.css({
        'top':'500px',
        'display':'block',
        'opacity':'0'
    });

    theimg.animate({
        'opacity':'1',
        'top':$thisX
    },800,'linear',function(){
        c++;
    });
}

我已经尝试过这个，因为两者都使浏览器崩溃。这让我觉得它正在创建一个无限循环。

我希望循环运行每个元素，一旦动画完成，继续下一个。任何帮助都会很棒:)

Answer 1

试试这个：

var c=0;

function nexStep(){
  if (c>=count) {
    return;
  }
  var theimg = $container.find('.img'+c+'');
  var $thisX = theimg.css('top');
  theimg.css({
        'top':'500px',
        'display':'block',
        'opacity':'0'
    });

    theimg.animate({
        'opacity':'1',
        'top':$thisX
    },800,'linear',function(){
        c++;
        nexStep();
    });
}
nexStep();