2

「i」変数が上書きされないようにするために、「遅延」と「アニメーション」が実行されているときにこのループを一時停止/中断し、「アニメーション」が完了した後に中断場所から続行するにはどうすればよいですか? または、アニメーション中に「i」変数が上書きされないようにする別の方法があるでしょうか?

for(i=0;i<inputs.length;i++){
    var now = inputs[i];
    var top = inputs[i].attr('top');
    if(!now.val()){
        if(dialog.css('display')=='none'){
            now.addClass('style');
            dialog.css('top',top).fadeIn(200);
        }
        else {
            dialog.delay(300).animate({"top": top}, 500, function(){
                now.addClass('style');
            });
        } 
    }
    else{
        now.removeClass('style');
    }
}

遅延とアニメーションが完了した後にクラスを追加する必要があるため、遅延とアニメーションの前にクラスを追加することはできません。

4

1 に答える 1

3

すべての要素のアニメーションが完了するまで、同じ関数を呼び出します。

var i = 0;

function animate() {
   if (inputs.length == i) {
      return;
   }
   var now = inputs[i];
   var top = inputs[i].attr('top');
   if (!now.val()) {
      if (dialog.css('display') == 'none') {
         now.addClass('style');
         dialog.css('top', top).fadeIn(200, function(){
            animate(); // recall it after fadein
         });
      } else {
         dialog.delay(300).animate({
            "top": top
         }, 500, function () {
            now.addClass('style');
            animate();// recall it after animate complete
         });
      }
   } else {
      now.removeClass('style');
   }

   i++;
}
animate();
于 2012-10-08T18:29:55.573 に答える