javascript - Fancybox 的问题。 Iframe 仅适用于网站上的第一个链接

Question

我正在为 Iframes 测试 Fancybox，我注意到在我的 Wordpress 博客上(我猜其他地方)iframe 只为我主页上的第一个链接打开。 不过，我已将 id 属性添加到所有链接。

任何想法为什么会这样以及如何纠正它？ 下面是代码。我只是将名称更改为 popup 并设置为所有链接 id="popup"。在示例页面上，它也使用 id，但仅在一个链接上。

<script type="text/javascript">
    $(document).ready(function() {
        $("#popup").fancybox({
            'width'             : '75%',
            'height'            : '75%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe'
        });
    });
</script>

Answer 1

ID必须是唯一的。如果您现有的代码类似于

<a href="whatever" id="popup">Link 1</a>
<a href="whateverelse" id="popup">Link 2</a>

改成

<a href="whatever" class="popup">Link 1</a>
<a href="whateverelse" class="popup">Link 2</a>

然后，将您的 Javascript 调整为

<script type="text/javascript">
    $(document).ready(function() {
        $("a.popup").fancybox({
            'width'             : '75%',
            'height'            : '75%',
            'autoScale'         : false,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'iframe'
        });
    });
</script>

使用他们文档中的代码对您不起作用的原因是因为他们的文档只处理单个链接，而不是一组链接。