$.Deferredを使って、一定間隔でスリープしながらループする
まずはSleepメソッドを自作する。
function Sleep(msec) { var d = $.Deferred(); setTimeout(function() { d.resolve(); }, msec); return d.promise(); }
繰り返したい処理の本体の実装。こちらも、Deferredを返すようにしておく。
function MyFunc(cnt) { var d = $.Deferred(); $("#divProgress").append("<p>in MyFunc() " + cnt + "</p>"); d.resolve(); return d.promise(); };
で、これをループで呼ぶ。ここでは10回呼ぶようにしてみる。
function() { var counter = [1,2,3,4,5,6,7,8,9,10]; var d = (new $.Deferred()).resolve(); $.each(counter, function(i, value) { d = d .then(function() { return MyFunc(value);}) .then(function() { return Sleep(1000);}); }); }
ポイントは、ループ開始前にDeferredオブジェクトをresolveしておき、それにつなげてthen, then…とやること。各functionの戻り値として、Deferredオブジェクトをリターンしまくること。