Fancybox на динамических ссылках

Question

Я искал похожие темы на SO, но ни одно из решений не помогло мне. Я заполняю свою страницу ссылками через Ajax. Вот так:

$.post('php/common/auction_view/auction_invoices.php', function(data){
   $('#auction-invoices').html(data);
   //Initiate Fancybox on links
   $("a.example4").fancybox({
            'opacity'       : false,
            'overlayShow'   : false,
            'transitionIn'  : 'elastic',
            'transitionOut' : 'elastic',
            'type'          : 'iframe'
   });
});

Хотя это не работает. у кого-нибудь есть решение? Thanx!

РЕДАКТИРОВАТЬ: Окей, нашел решение:

$.post('php/common/auction_view/auction_invoices.php', function(data){
$('#auction-invoices').html(data);
$.getScript("fancybox/jquery.fancybox-1.3.4.js", function(){
    $.fancybox.init();
    $("a.example4").fancybox({
        'transitionIn'      : 'elastic',
        'transitionOut'     : 'elastic',
        'overlayShow'       : false, 
        'showCloseButton'   : true, 
        'width'             : 450, 
        'height'            : 585, 
        'titleShow'         : false, 
        'type'              : 'iframe'
    });
});

});

enter code here

Answer 1

Этот ответ мне не помог, он сложный, но это решение мне помогло (jquery 1.7.2 и fancybox 1.3.4):

Откройте jquery.fancybox-1.3.4.js и отредактируйте его в строке 790 следующим образом

    $.fn.fancybox = function(options) {
    if (!$(this).length) {
        return this;
    }

    $(this)

        .unbind('click.fb')
        .live('click.fb', function(e) {
         $(this).data('fancybox', $.extend({}, options, ($.metadata ? $(this).metadata() : {})))
            e.preventDefault();

Это решение решило мои проблемы, и больше не нужно ничего менять, даже инициализация остается по умолчанию.

$(".trigger").fancybox();

Это просто и чисто. Надеюсь, это поможет.

Answer 2

Fancybox v1.3.x не поддерживает динамически добавляемые элементы.

Я ответил на аналогичный вопрос здесь , который использует метод jQuery .on() для привязки fancybox к динамически добавляемым элементам.

Настройте код, соответствующий вашему контейнеру, например:

$("#auction-invoices").on("focusin", function(){...