jQuery UIのdialogを使い捨てで使う場合

$('<div />').dialog({

    close: function(event) {

        $(this).dialog('destroy');

        $(event.target).remove();

});

今日初めて使った。
ダイアログ表示させる時、その要素がDOMツリーに入ってないとちゃんと
bodyの最後に追加してからdialogとして表示してくれる。
だがそのままではダイアログを閉じてもDOMツリーに追加されたままなので
閉じた際に削除する必要がある。


closeイベント時に「$(this).dialog('destroy');」を飛び出せば
ダイアログは消えるがダイアログ内に表示させた要素はbodyの最後に残ったままだ。


なのでダイアログとその中身を消すためには上のように
「$(event.target).remove();」などとしてダイアログの中身も消す必要がある。


何も考えず使い捨て感覚で使ってたらidとかかぶってイベントがおかしくなった。