jQuery Dialog, как связать событие изменения размера окна, но только когда диалог существует

Question

Я использую модальное диалоговое окно jQuery UI.Я хочу, чтобы диалоговое окно было зафиксировано в середине экрана и в браузере изменило размеры для позиции для автоматического обновления.Оказывается, это не доступно по умолчанию.

Итак, что я сделал:

dialog = $('<div id="dialog-content" class="ui-dialog-container"></div>').html('<div class="loading">Loading...</div>').dialog({
    autoOpen: true,
    position: ['center', 130],
    open: function() {

        // Fixed Positioning
        $('.ui-dialog').css({position:"fixed"});

        // Reposition on Window Resize
        $(window).resize(function() {
            console.log('resizing);
            $('.ui-dialog').dialog("option", "position", "center");
        });


    }
});

Обратите внимание:

            console.log('resizing);

Проблема здесь в том, что покаэта работа, когда диалоговое окно закрыто, событие изменения размера все еще срабатывает.Как я могу сделать это привязкой, связанной с диалогом, чтобы при уничтожении диалога привязка также уничтожалась?

Спасибо

Answer 1

Вы должны отменить привязку события изменения размера при закрытии диалога:

.dialog({
    ...,
    open: function() {
        ...
        $(window).bind('resize.dlg', function() {
            ...
        });
    }
    close: function() {
        $(window).unbind('resize.dlg');
    }
});

Answer 2

Добавьте это к своим параметрам диалога:

close:function(){
    $(window).unbind('resize');
}