Используйте jQuery Fancybox (диалог типа лайтбокса) с динамически загружаемыми ссылками

Question

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

jQuery("a#[id^='domore_']").fancybox({
'autoDimensions' : false,
'width'           : 'auto',
'height'          : 'auto'
});

Это работает нормально, но когда страница или ссылки перезагружаются с помощью ajax, это не работает. Я пытался использовать live (), но я не мог заставить его работать. Как перепривязать или реализовать live на fancybox? Есть ли способ сделать это? Спасибо

Answer 1

Я лично использую живую функцию jQuery .

jQuery("a#[id^='domore_']").live('click', function(){
    jQuery.fancybox({
        'autoDimensions'  : false,
        'width'           : 'auto',
        'height'          : 'auto',
        'href'            : $(this).attr('href')
    });
    return false;
});

Примечание: На самом деле не связано с вашей проблемой, но имейте в виду, что jQuery 1.4.2 имеет некоторые проблемы при использовании события изменения для выбора в IE, но 1.4.1, кажется, подходит для сейчас. (поиск в Google (метод live () для события 'change' не работает в Jquery 1.4.2 для IE (работает в 1.4.1) "в Google, я не могу добавить ссылку, поскольку я новичок)

Надеюсь, это поможет

Answer 2

Вы можете использовать это. У меня это сработало

$('.address').live('click',
function(){                 
    $(this).fancybox({
        'width'         : '40%',
        'height'        : '70%',
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'type'          : 'iframe',
        'onClosed'      : function() {
            $("#basket").load("/order/basket");   
        }
    }).trigger("click"); 
    return false;
});

Answer 3

Возможно, вам придется включить вызов функции faceybox в ваш метод ajax success / callback:

$.ajax({
  url: 'test.html',
  success: function(data) {
    $('.result')
     .html(data)
     .find("a#[id^='domore_']").fancybox({
       'autoDimensions' : false,
       'width'          : 'auto',
       'height'         : 'auto'
     });
  }
});