Диалог пользовательского интерфейса jQuery - проблема с событием при закрытии

Я пытаюсь выполнить определенное действие, когда закрываю диалоговое окно пользовательского интерфейса jQuery. Вот упрощенная версия моего кода:

$('a.open-trigger').click(function(){
    var test = 'hello';

    $('#dialog').dialog({
        bgiframe: true,
        dialogClass: 'change', 
        resizable: false,
        draggable: false,
        modal: true,
        height: 334, 
        width: 450,
        autoOpen: false,
        show: 'fade'
    });

    $('#dialog').dialog('open');

    $('a.close-trigger').click(function(){
        alert(test);
        $('#dialog').dialog('close');
    });
});

В первый раз, когда я закрываю диалоговое окно, я получаю ожидаемое предупреждение со словом «привет». Если я открою диалоговое окно во второй раз и закрою его, я дважды получу предупреждение «привет». Если я открою и закрою его в третий раз, я получу три предупреждения и так далее.

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

Спасибо! Саймон


jquery-ui jquery-ui-dialog
person Simon    schedule 14.05.2009    source источник

Ответы (3)


arrow_upward
8
arrow_downward

Вы подключаете дополнительные обработчики событий каждый раз, когда вызываете .click. Именно поэтому он дублируется.

$('a.close-trigger').click(function(){
                    alert(test);
                    $('#dialog').dialog('close');
            });

Вытяните этот код на тот же уровень, что и привязка другого события, и он должен работать так, как ожидалось.

person geowa4    schedule 14.05.2009

arrow_upward
0
arrow_downward

Вы привязали функцию к кнопке открытия, которая добавляет обработчик события к кнопке закрытия каждый раз, когда вызывается событие открытия. Вы должны добавить обработчик события закрытия где-то за пределами функции события "a.open-trigger"...

$('a.open-trigger').click(function(){
        var test = 'hello';

        $('#dialog').dialog({bgiframe: true, dialogClass: 'change', resizable: false, draggable: false, modal: true, height: 334, width: 450, autoOpen: false, show: 'fade'});
        $('#dialog').dialog('open');
});

$('a.close-trigger').click(function(){
        alert(test);
        $('#dialog').dialog('close');
});
person Casey Williams    schedule 14.05.2009

arrow_upward
0
arrow_downward

Вам нужно вывести обработчик события закрытия клика из обработчика события открытия клика.

$(function() {
    $('#dialog').dialog({bgiframe: true, dialogClass: 'change', resizable: false, draggable: false, modal: true, height: 334, width: 450, autoOpen: false, show: 'fade'});

    $('a.open-trigger').click(function(){    
        $('#dialog').dialog('open');
    });


    $('a.close-trigger').click(function(){
        alert("hello");
        var myDialog = $('#dialog');
        if (myDialog.dialog('isOpen'))
            myDialog.dialog('close');
    });
});
person Russ Cam    schedule 14.05.2009