Как глобально обрабатывать событие onClose fancybox?

Я использую Fancybox в своем приложении. Теперь для обработки события close мы пишем что-то вроде:

$(".fancybox").fancybox({onClose:function(){alert('blah');}}

как видно на этой страничке документа:

http://fancyapps.com/fancybox/#docs

однако я хочу написать что-то общее и глобальное для всех fancybox, который запускается каждый раз для любого из fancybox. Как мне это сделать? Короче говоря, я не хочу писать код onClose на каждом fancybox и не хочу,чтобы он зависел от класса, id (Напр. .fancybox в данном случае). Как мне это сделать? Я попытался написать:--4-->

$.fancybox({onClose:function(){alert('blah');}}

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

4 ответов


Я не уверен, что это лучшее решение, но я бы пошел на шаблон pub/sub, поэтому в вашем fancybox вы должны сделать что-то подобное.

$(".fancybox").fancybox(
{   onClose:function(){
                $(window).trigger('fancyboxClosed');
            }
});

затем, где-то в вашем коде:

$(window).on('fancyboxClosed', function(){
    // Your global function for fancybox closed
});

Я не очень много знаю о вашей цели, но имейте в виду, что вы всегда можете передать именованную функцию вместо анонимной, поэтому вы всегда запускаете одну и ту же функцию.

приведенный выше пример должен быть путь, чтобы пойти, если вы хотите сделать разные вещи в зависимости от каждого fancybox.

кроме того, вы можете прикрепить событие к любому объекту, который вы хотите. Просто используется окно для удобства.

редактировать

вы также можете отредактировать свой источник fancybox, чтобы сделать это (изменить для 1.3.4) просто добавьте $(window).trigger('fancyboxClosed'); около линии 953.


попробуйте использовать методы

beforeClose и afterClose

этот код работает штраф в размере

$(".fancybox").fancybox({beforeClose:function(){alert('blah');}}

из того, что я вижу, Fancybox не предоставляет API для этого. Вместо этого вы можете использовать hack. Лайтбокс закрывается, когда:

  1. кнопка закрытия нажата (div с классом 'fancybox-close')
  2. щелкается черный фон (div с классом "fancybox-overlay")
  3. кнопка escape нажата (e.который = 27)

таким образом, вы можете добавить обработчик щелчка в тело, чтобы проверить событие.цель .fancybox-close или .fancybox-оверлей. Также добавить вниз обработчик документа для прослушивания при нажатии клавиши escape.


вот достойное решение для 1.3.4

$(document).delegate('#fancybox-close,#fancybox-overlay','click',function(){
    FancyBoxClosed(); 
});
$(document).keyup(function(e){
    if(e.keyCode == 27){
        if($('#fancybox-overlay').css('display') != 'none')
            FancyBoxClosed();
    }
});

function FancyBoxClosed()
{
    //global callback for fancybox closed
}

для версии, отличной от 1.3.4, дважды проверьте селекторы элементов fancybox для кнопки наложения и закрытия с помощью dragonfly, firefly или других.