JQuery when()とdone()について

Question

JQueryで順番に処理を実行したい場合に、
whenとdoneを使うということでやってみたのですが、
「人間の目」には順番に処理されておらず困っています。

具体的には、

$.when($("#image").remove())
 .done(alert("hogehoge"));

というものを実際に見ると、
メッセージhogehogeが表示されても
画像#imageはブラウザ上に残っています。

だからといって「順番に処理されていない」というわけではきっとないのだろうと思います。

間にVBでいうところのdoeventsみたいなのがあると良いのかなーとは思いますが、
人間の目から見て、画像が消える→メッセージがでる、という処理になる方法は何かないものでしょうか？

今回の例での場当たり的な対応としては、

$.when($("#image").remove())
 .done(setTimeout('alert("hogehoge")',100));

のようにすれば良いのかもしれませんが、
when内の処理に時間がかかったり、かかる時間が一定でない場合など、
setTimeoutに設定する時間にある程度の余裕を持たせないといけなくなると思います。
こういう匙加減の問題はなるべく無くしたいので、
これ以外の方法で何か良い方法があればと思います。

よろしくお願いします。

Answer 1

whenは非同期処理の終了を待つ処理ですから、
なんらかのwait処理などと併用するとよいのでは？
$.Deferredと絡めてやってください

$(function(){
  $('#image').click(function(){
    $.when(
      $("#image").remove(),wait(3)
      )
      .done(
        function(){alert("hogehoge")}
        )
  });
});
function wait(sec) {
    var d = $.Deferred();
    setTimeout(function(){d.resolve();}, sec * 1000);
    return d.promise();
}

この場合、#imageが消えて3秒後にアラートがでますが
瞬時に処理したいならwait(0)とすれば良いと思います。

Comments

[nobuzoh]

自己解決にしなくてよかったです。
deferredを検索するとpromise,,resolve,rejectなども出てきたので、
この辺全部勉強してみます。

ありがとうございました。

Answer 2

長々と書いたのですが、
もしや？と思いやってみると

$.when($("#image").remove())
 .done(setTimeout('alert("hogehoge")',0));

でも間違いなく処理されますね。
setTimeoutがdoeventsのようなワンクッションになってくれていようです。

Comments

[Lhankor_Mhy]

jQueryのソースを見てきましたが、removeメソッドはpromiseしていないと思います。

[nobuzoh]

習うより慣れろ的にやってるのですが、
promiseに合わせてdeferred,resolve,reject辺り勉強した方が良さそうですね。