192

jquery-ui-dialogプラグインを使用しています

ダイアログが閉じられたときにページを更新する方法を探しています。

ダイアログから閉じるイベントをキャプチャする方法はありますか?

閉じるボタンがクリックされたときにコードを実行できることはわかっていますが、ユーザーがエスケープまたは右上隅の x で閉じることはカバーされていません。

4

10 に答える 10

253

私はそれを見つけた！

次のコードを使用して、close イベントをキャッチできます。

 $('div#popup_content').on('dialogclose', function(event) {
     alert('closed');
 });

明らかに、アラートを必要なものに置き換えることができます。
編集: Jquery 1.7 以降、bind() は on() になりました

于 2008-10-05T13:42:54.967 に答える
201

ダイアログの作成中にもできると思います（私が行ったプロジェクトからコピーしました）：

dialog = $('#dialog').dialog({
    modal: true,
    autoOpen: false,
    width: 700,
    height: 500,
    minWidth: 700,
    minHeight: 500,
    position: ["center", 200],
    close: CloseFunction,
    overlay: {
        opacity: 0.5,
        background: "black"
    }
});

ノートclose: CloseFunction

于 2008-10-05T19:35:17.393 に答える
32 
$("#dialog").dialog({
    autoOpen: false,
    resizable: false,
    width: 400,
    height: 140,
    modal: true, 
    buttons: {
        "SUBMIT": function() { 
        $("form").submit();
    }, 
        "CANCEL": function() { 
        $(this).dialog("close");
    } 
    },
    close: function() {
      alert('close');
    }
});
于 2009-11-10T08:06:13.043 に答える
16

Uもこれを試すことができます

$("#dialog").dialog({
            autoOpen: false,
            resizable: true,
            height: 400,
            width: 150,
            position: 'center',
            title: 'Term Sheet',
            beforeClose: function(event, ui) { 
               console.log('Event Fire');
            },
            modal: true,
            buttons: {
                "Submit": function () {
                    $(this).dialog("close");
                },
                "Cancel": function () {
                    $(this).dialog("close");
                }
            }
        });
于 2012-06-20T09:45:16.223 に答える
10

これは私のために働いたものです...

$('#dialog').live("dialogclose", function(){
   //code to run on dialog close
});
于 2011-07-19T17:59:36.337 に答える
8

jQuery 1.7 の時点で、.on() メソッドは、イベント ハンドラーをドキュメントにアタッチするための推奨メソッドです。

を使用して実際に回答を作成した人は誰もいなかったからです。on()代わりに、bind()作成することにしました。

$('div#dialog').on('dialogclose', function(event) {
     //custom logic fired after dialog is closed.  
});
于 2014-11-10T08:07:26.410 に答える
4

あなたが話しているウィンドウのタイプを理解している場合、$(window).unload() (ダイアログウィンドウ用) は必要なフックを提供しませんか?

(そして、私が誤解していて、ポップアップ ブラウザー ウィンドウではなく、CSS を介して作成されたダイアログ ボックスについて話している場合、そのウィンドウを閉じるすべての方法は、クリック ハンドラーを登録できる要素です。)

編集:ああ、CSS で作成された jquery-ui ダイアログについて話しているようです。要素のクリック ハンドラをクラスui-dialog-titlebar-close に登録することで、ウィンドウを閉じるXをフックできます。

もっと役立つのは、おそらく、それをすばやく理解する方法を教えてくれることです。ダイアログを表示しているときに、FireBug を開いて、ウィンドウを閉じることができる要素を調べるだけです。それらがどのように定義されているかがすぐにわかり、クリック ハンドラーを登録するために必要なものが得られます。

したがって、あなたの質問に直接答えるには、答えは本当に「いいえ」だと思います-フックできるクローズイベントはありませんが、「はい」-ダイアログボックスをかなり簡単に閉じるためのすべての方法をフックして取得できますあなたが欲しいもの。

于 2008-10-05T13:12:27.370 に答える
2

次のコードを試して、任意のアイテムの終了イベントをキャプチャできます：ページ、ダイアログなど。

$("#dialog").live('pagehide', function(event, ui) {
      $(this).hide();
});
于 2011-06-16T11:56:27.567 に答える