代码之家  ›  专栏  ›  技术社区  ›  Panama Jack

对动态加载的链接使用jQuery Fancybox(lightbox类型对话框)

  •  5
  • Panama Jack  · 技术社区  · 14 年前

    我试图绑定花哨的盒子链接,这样当新的链接被创建时,它仍然可以工作。我在这里看到了一些其他的问题,但没有得到真正的回答。这就是我要做的。

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

    这很好,但是当页面或链接被ajax重新加载时,它就不起作用了。我试过使用live(),但没能成功。如何在fancybox上重新绑定或实现live?有什么办法吗?

    3 回复  |  直到 14 年前
        1
  •  11
  •   jamesahallam    14 年前

    我个人使用 jQuery's live function

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

    注: 与您的问题无关,但请注意,jquery1.4.2在IE中的select上使用change事件时有一点问题,但1.4.1现在似乎还可以(在Google上搜索“live()method for'change'event breaked in Jquery 1.4.2 for IE(worked in 1.4.1)”,我不能添加链接,因为我是新的)

        2
  •  2
  •   stealthyninja michkra    12 年前

    你可以用这个。它对我有用

    $('.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;
    });
    
        3
  •  1
  •   Mottie    14 年前

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