jQuery UI dialogでcloseしてもdestroyしてもコンテンツが残る

jQuery UI dialogはclose destroyというメソッドが用意されています。
dialog.closeは文字通りdialogを非表示にするだけ。
dialog.destroyはdialogを消去します。

しかしこのdialog.destroyが曲者で、dialog内のコンテンツは消去しないようです。

動的に作ったjQueryオブジェクトに対し、dialogを作成すると、bodyタグの中に次々とごみが残っていきます。。

それを回避するためにはonCloseイベントでdialog.destroyメソッドを呼んだあと、
dialog.widgetメソッドを呼び、戻り値にremoveメソッドを呼んでやればすべて消えます。
[javascript]
scope = this
this.dialog = $(‘<div class="テスト">これはテストです</div>’);
this.dialog.dialog({
close: function(){scope.onClose()}
});
this.onClose= function(){
this.dialog.dialog("destroy");
this.dialog.dialog("widget").remove();
}
[/javascript]

1 thought on “jQuery UI dialogでcloseしてもdestroyしてもコンテンツが残る

  1. ピンバック: [jQuery]dialogの動作に関して | 技術的備忘録

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です