9

我需要知道fancybox 已经打开以允许或拒绝启动另一个功能。

像“onStart”或“onClosed”这样的内置函数 Fancybox 不起作用。

我说的是版本 1.3.0 RC2

4

8 回答 8

13

$.fancybox.isOpen(bool) 表示，fancybox 是否打开。

于 2014-11-12T15:27:34.433 回答
10

您使用的版本显然与文档不匹配；我查看了源代码，发现选项的名称与在线文档不同。我刚刚用 1.3RC2 测试了以下内容：

$(document).ready(function() {

    function myStartFunction() { alert('fancy box opened'); }

    $("a#inline").fancybox({
        'onStart': myStartFunction
    });  
});

您正在寻找的选项是“onStart” - 每次我打开一个盒子时，myStartFunction 中的警报都会响起。我不确定他们何时更改了选项，但您可以查看底部使用的任何版本的来源，并查看应该调用什么选项。

编辑

我刚刚仔细检查了 v1.2.5 - 我使用的版本 - 回调的名称确实不同。callbackOnStart 适用于 1.25，但正如我所说，不适用于 1.3

于 2010-01-24T23:35:06.767 回答
8

尝试使用方法

beforeLoad, // Before loading
afterLoad, // After loading
beforeShow, // Before changing in current item
afterShow, // After opening

此代码工作正常

$(".fancybox").fancybox({beforeShow:function(){alert('blah');}});
于 2012-08-12T07:57:39.637 回答
4

如果您正在寻找一种方法来确定fancybox 是否打开（而不是在打开fancybox 时触发的事件），那么从fancybox v2 开始，您可以使用该$.fancybox.isOpen属性。它没有记录（至少我没有找到任何参考资料），但它有效。

例子：

if(!$.fancybox.isOpen) {
    $.fancybox.open({
        href: '#newsletter-campaign-popup',
        height: 385,
        width: 510,
        type: 'inline'
    });
}

如果已经打开了第二个fancybox，则上面的示例会阻止打开第二个fancybox。

于 2013-06-06T15:38:59.440 回答
3

我不确定你所说的内置函数是什么意思。Fancybox 具有调用用户定义函数的回调（您必须自己制作）。像：

function myClose()
{
    alert('close');
}

function myStart()
{
    alert('start');
}

$("a#single_image").fancybox({
     'callbackOnClose': myClose,
     'callbackOnStart': myStart
// etc, etc..
});

或者，您可以检查fancy_contentdiv 以查看其内部是否有任何内容。（如果有，则fancybox 已打开）。

if ( $('#fancy_content:empty').length > 0 )
{
  // Is empty
}
于 2010-01-24T23:20:34.523 回答
2

这似乎对我有用：

        isLoaded : function(){
            return $('#fancybox-content').html()!='';
        }
于 2012-05-31T18:02:17.430 回答
1

如果您有多个用于 fancybox 的 div，以下代码可能是更好、更通用的解决方案：

if ($('.fancybox-opened').length == 0) {
  //there is no fancybox opened at all
}

另请注意，即使 fancybox 已关闭，fancybox 的内容可能并不总是空的。

于 2014-05-27T17:53:33.363 回答
1

2018 年 12 月的答案。

if ($('.fancybox-content').length == 0) {
    //there is no fancybox opened at all
}

细节： 

    function checkf()
    {
        if ($('.fancybox-content').length == 0) {
            alert('there is no fancybox opened at all.');
        }
        else
        {
            alert('there is a fancybox opened.');
        }
    }
    $("#ffbox").click(function()
    {
        setTimeout(checkf,1000);
    });
    checkf();
    <head>
        <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.2/dist/jquery.fancybox.min.css" />
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="//cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.2/dist/jquery.fancybox.min.js"></script>
    </head>
    <body>
        <a data-fancybox data-options='{"iframe" : {"css" : {"width" : "80%", "height" : "80%"}}}' href="https://www.google.com/maps/search/?api=1&query=China" class="btn btn-primary" id="ffbox">Display Google Map</a>
    </body>

于 2018-12-06T04:17:49.777 回答