javascript中断并继续循环

当循环中的“延迟”和“动画”正在运行时，如何暂停/中断循环，并在“动画”完成后从中断位置继续循环，以防止“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');
    }
}

---

调用相同的函数，直到所有元素动画完成

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

---

非常感谢，这真的很有帮助！