Fancybox无法动态添加外部链接

时间:2017-11-20 06:33:00

标签: jquery html fancybox

我有一个项目清单如下

<ul>
 <li><a href="http://toExtUrl/img.jpg" class="should-popout">
  <img src="http://mywebsite.com/icon.png"></a>
 </li>
</ul>

toExtUrl / img.jpg是动态添加的,它有时可能显示pdf或HTML内容而不是图像(这始终是外部链接)。我试图给出&#39; .should-popout&#39;的href属性所带来的fancybox弹出效果。

但是点击它只是重定向到外部URL发生。我的fancybox选项如下

$(window).load(function(){
 $('a.should-popout').fancybox({
    'autoDimensions' : true,
    'autoScale' : true
    'hideOnContentClick': true,
    'showCloseButton' : true
 });
});

设置中可能出现的错误。

2 个答案:

答案 0 :(得分:1)

您需要先阅读文档。

Read it here

for v3

$().fancybox({
  selector : 'a.should-popout',
  loop     : true
});

旧版本

Read it here in api method

$(document).on('click','a.should-popout',function(event){
    $.fancybox.close(true);
    $.fancybox.open($(this));
});

答案 1 :(得分:1)

我建议您升级到v3并使用如下:

$().fancybox({
  selector : '.should-popout'
});

v2尝试获取当前选择器(使用这个方便的https://api.jquery.com/selector/属性),然后使用它来创建委托事件处理程序。但jQuery v3删除了该功能,因此不再适用。因此v3允许这种新语法。