Question

我遇到了FancyBox的问题，它可能很容易修复，但我无法弄明白。我有一个链接，当它点击它的链接时，我希望它打开外部页面。但问题是链接只刷新当前的FancyBox，并且从不打开其他页面。这是我的代码：

$("#preview-box").html('<a href="http://www.google.com" target="_blank" >Go To Original</a><iframe sandbox="allow-forms allow-scripts" src="http://www.yahoo.com" width="100%" height="100%" style="min-height: 500px;"></iframe>');

$('#preview-box').fancybox({
    autoSize: false,
    width: '80%',
    height: '80%',
    onClosed: function () {
        $("#preview-box").empty();
    },
    afterClosed: function () {
        $("#preview-box").empty();
    }
}).trigger('click');

我的问题是，为什么新链接无法在新标签页中打开，只是刷新当前内容，以及如何才能使其生效？

Answer 1

我读得你的代码太快了，投票把你的问题关闭为重复，抱歉:(

你遇到的真正问题是你处于循环：你将fancybox绑定到（#preview-box）的选择器与fancybox所针对的选择器相同...所以每当你点击fancybox里面的链接（显示#preview-box的内容）时，同一个选择器会在fancybox内再次被调用。

您应该将代码更改为此

$("#preview-box").html('<a href="http://www.google.com" target="_blank" >Go To Original</a>');

$.fancybox({
    href: "#preview-box",
    autoSize: false,
    width: '80%',
    height: '80%',
    afterClose: function () {
        $("#preview-box").empty();
    }
});

我删除了不必要的，过时的或错误的代码，例如iframe和onClosed API选项。

参见 JSFIDDLE

FancyBox不会打开链接到外部页面

1 个答案: