Question

我在我的网站上使用Fancybox打开指向其他网页（外部网页）的链接。

基本上，用户点击图片，这会打开一个包含外部页面的fancybox。图像链接包含在另一页（父母）的DIV中显示的页面（子）中。父级能够通过重新加载具有不同参数的子页面来重新加载DIV中的数据，这将导致图像和链接发生变化。

这一切都与第一次加载完美配合。但之后，当DIV重新加载包含不同数据的子页面时，fancybox弹出窗口不再起作用。如果我然后在页面上进行F5刷新，它将再次起作用。但只是在第一次加载时。

子页面上为图像链接设置fancybox的代码：

$.noConflict();
$(document).ready(function() {
    $(".userdetailslink").fancybox({
        'width'             : '80%',
        'height'            : '80%',
        'autoScale'         : false,
        'transitionIn'      : 'elastic',
        'transitionOut'     : 'elastic',
        'type'              : 'iframe'
    });
});

我也尝试了以下相同的结果：

$.noConflict();
$(".userdetailslink").ready(function() {
    $(".userdetailslink").fancybox({
        'width'             : '80%',
        'height'            : '80%',
        'autoScale'         : false,
        'transitionIn'      : 'elastic',
        'transitionOut'     : 'elastic',
        'type'              : 'iframe'
    });
});

任何帮助都将不胜感激。

Answer 1

您是否使用AJAX方法加载div？您可以使用回调函数将事件处理应用于加载的内容。

 $("div").load("url", function(){
       $(".userdetailslink").fancybox({
    'width'             : '80%',
    'height'            : '80%',
    'autoScale'         : false,
    'transitionIn'      : 'elastic',
    'transitionOut'     : 'elastic',
    'type'              : 'iframe'
    });

 });

这样它也会在加载后运行。当然，你可以按原样进行初始加载。

DIV重新加载后JQuery Fancybox无法正常工作

1 个答案: