當循環結束時，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'); 
    } 
}