当循环结束时，Javascript执行一个动作

Question

我想显示一个正在执行的循环加载gif。当循环完成后隐藏它。 For循环持续几秒钟。

$("#loading").removeClass('hidden'); 
     for (var i = 0; i < 10; i++) 
     { 
      clearInfo(i); 
      loadInfo(i, getInfo()); 
     } 
$("#loading").addClass('hidden'); 

这是行不通的。我想最后一个addClass在removeClass之后执行，并且不在等待循环...

一种方法应该是，将循环插入带回调函数，但是没有更简单的方法吗？

Regards，

Answer 1

JavaScript正在单线程中运行。通过复杂的同步计算来阻塞这个线程不是一个好主意。结帐WebWorkers。

如果loadInfo是异步操作，您可以使用承诺如下：

有回调

// show your loading indicator 

var promises = []; 
for (var i = 0; i < 10; i++) { 
    clearInfo(i); 

    // loadInfo returns promise 
    promises.push(loadInfo(i, getInfo())); 
} 
Q.all(promises) 
    .then(function() { 
    // hide your loading indicator 
    }); 

解决方案将是一个混乱和肮脏的（根据我个人的看法）。

Answer 2

我可能会做沿着此线的东西：如果你正在使用JQuery，你可以使用像`.hide方法

$("#loading").removeClass('hidden'); 
for (var i = 0; i < 10; i++) { 
    clearInfo(i); 
    loadInfo(i, getInfo()); 
    if (i == 9) { 
     // this is the final pass through the loop 
     $("#loading").addClass('hidden'); 
    } 
}