Question

我使用fancybox通过在链接中包含较小的照片来显示较大的照片。这很好用。工具提示jQuery应用程序存在小问题，这就是为什么我得到var'title_from_alt'并用它设置fancybox标题。它并不那么重要。

好的，现在我通过AJAX调用检索页面。在部分，有与'fancyboxfoto'类的新链接。但是这些新添加的链接没有附加的花式框。

我读过.on和.live等等，但他们似乎想要一个事件（比如'click'）但是在下面的代码中我没有看到事件'click'。怎么做！？

jQuery(document).ready(function($){

//fancybox
var title_from_alt = $("a.fancyboxfoto").attr("alt");
$("a.fancyboxfoto").fancybox({
    'titlePosition'     : 'over',
    'onComplete'    :   function() {
        $("#fancybox-wrap").hover(function() {
            $("#fancybox-title").show();
        }, function() {
            $("#fancybox-title").hide();
        });
    },
    'overlayColor'      : '#000',
    'title'         : title_from_alt,
    'overlayOpacity'    : 0.9,
    'showCloseButton' : 'true',
    'autoScale' : 'true',
    'autoDimensions' : 'true'
});
});

HTML

<a class="fancyboxfoto" title=" Tirzo Martha, Shipwrecked, 2002 " href="/images/Shipwrecked.jpg">
  <img class="tiptip" vspace="12" hspace="12" align="left" title=" Tirzo Martha, Shipwrecked, 2002 " src="/images/Shipwrecked-kl.jpg">
</a>

Answer 1

您应该在通过AJAX检索新DOM元素后再次初始化fancybox。

Answer 2

fancybox v1.3.x不支持动态添加的元素。

您可以找到workaround here（包含示例）

BTW，如果使用该方法，您不需要“通过AJAX 检索新DOM元素后再次初始化fancybox”

ajax调用后没有附加到链接的fancybox

2 个答案: