Fancybox：iframe不起作用

非常简单的test.html页面：

        $(document).ready(function () { /* This is basic - uses default settings */ $("a.iframe").fancybox(); });    This goes to iframe   

然而，fancybox只是不起作用…对js文件和css的引用是正确的。 JQuery正常运行。 但是点击链接只是一个普通的链接。 即：我重定向到google.be。 仅供参考：这不仅仅是谷歌，而是我放在那里的每一个url。 我在这里想念的是什么？

Answer 1

我成功地将锚上的类更改为fancybox fancybox.iframe 。

 This goes to iframe  

不知道为什么会这样，但它对我有用。

编辑 ：还需要更新到最新版本的jQuery

Answer 2

正如解释因为@imjared说：

不知道为什么会这样，但它对我有用。

由于您尝试打​​开外部页面，因此逻辑步骤是在iframe模式下打开fancybox，但是fancybox无法知道它必须将内容包装在iframe标记中。

告诉fancybox有三种方法可以做到：

1）。 添加type: "iframe"到您的自定义脚本，如：

 $('a.fancybox').fancybox({ type: "iframe" }); 

2）。 将属性data-fancybox-type="iframe"到您的锚标记中，如：

 This goes to iframe 

它需要HTML5 DOCTYPE 。

3）。 将特殊类fancybox.iframe添加到锚标记中，如接受的答案中所示。

fancybox脚本能够评估上面的任何状态，但你应该至少选择其中一个来使它工作（你可以使用多个或完全一样，它会工作，但它是多余的）

注意 ：这仅适用于fancybox v2.x +（…并且需要jQuery v1.6或更高版本）

顺便说一句：由于安全限制，某些网站无法在iframe打开，例如google或facebook 。 您应该始终考虑使用iframe和ajax内容的Same origin策略 。

Answer 3

由于@JFK说明，这对我有用：

                    This goes to iframe   

Answer 4

好像跨域链接没有打开。 我使用的是localhost，使用href="http://localhost/example/?page_id=7896"只能使用。 如果我写href="http://google.com"它不起作用。 如果您可以通过将您的网站放在域上并使用href="http://example.com?page_id=7896"

在html中：

 Link 

在js中：

 $("#iframe").fancybox({ 'type' : 'iframe' });