Как подключить обратный вызов к эффекту jquery при показе диалога?

Моя проблема в том, что я не знаю, как подключить обратный вызов к диалоговому шоу jquery ui.

На самом деле это вариант:

$( ".selector" ).dialog({ show: 'slide' });

Я хочу иметь обратный вызов после завершения анимации слайдов. Я посмотрел из самих эффектов, и у них есть обратный вызов:

effect( effect, [options], [speed], [callback] )

Но в диалоге эффект настроен совсем по-другому. Я попробовал также поставить:

$( ".selector" ).dialog({ show: 'slide', callback: function() {} });

Но это не сработало.

Предложения?

Ответы

Ответ 1

Обновление 2015-07-27 Для тех, кто использует jQuery v1.10.0 или выше, см. этот другой ответ, поскольку мое решение не будет работать с более новыми версиями jQuery.

Оригинальный ответ

Уже ответили, но поскольку у меня был ответ, я все равно отправлю ему сообщение & hellip;

$('#dialog').dialog({
    show: {
        effect: 'slide',
        complete: function() {
            console.log('animation complete');
        }
    },
    open: function(event, ui) {
        console.log('open');
    }
});

Показывает open, за которым следует animation complete в консоли

Ответ 2

Два года спустя предлагаемое решение (by @andyb) больше не работает в текущих версиях пользовательского интерфейса jQuery (в частности, начиная с версии 1.1.0.0). Его решение опиралось на метод обратного вызова complete - недокументированная функция.

Я придумал современное решение, используя jQuery Promise объект:

$("#dialog").dialog({
    show: {
        effect: "drop",
        direction: "up",
        duration: 1000
    },
    hide: {
        effect: "drop",
        direction: "down",
        duration: 1000
    },
    open: function () {
        $(this).parent().promise().done(function () {
            console.log("[#Dialog] Opened");
        });
    },
    close: function () {
        $(this).parent().promise().done(function () {
            console.log("[#Dialog] Closed");
        });
    }
});

Вот обычная демонстрация JSFiddle: http://jsfiddle.net/losnir/jcmpm/

Ответ 3

Я загрузил пакет jquery ui dev и обнаружил, что обратный вызов установлен с "полным":

$( ".selector" ).dialog({ show: 'slide', complete: function() {} });

Спасибо всем, кто поможет решить эту проблему:)

Ответ 4

Попробуйте использовать open событие диалога:

$( ".selector" ).dialog({
   open: function(event, ui) { ... }
});

Ответ 5

Я счел необходимым использовать событие "focus:". Я проиграл правильно выбранную кнопку из-за шоу:. Прекрасные взаимодействия.

focus: function( event, ui ) {
    $(this).siblings('.ui-dialog-buttonpane').find("button:contains('Upload')").focus();
},