JavaScript的休息和繼續循環

Question

我如何可以暫停/「延遲」和「動畫」時，裏面正在運行打破這種循環，從斷點處繼續之後「動畫」，以防止「我」做變量是否被覆蓋？ 或者也許有另一種方法來防止'我'變量在動畫過程中被覆蓋？

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'); 
    } 
} 

我不能把延遲和動畫之前添加類，因爲我需要添加類延遲和動畫完成後。

Answer 1

通過調用同樣的功能，直到所有元素的動畫完成。

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();