Javascript 如何确定fancybox何时打开？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2128652/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to determine when fancybox is open?
提问by Ax.
I need to know that fancybox has been open up that to allow or deny another function to start.
我需要知道fancybox 已经打开以允许或拒绝另一个功能启动。
Build-in functions Fancybox like 'onStart' or 'onClosed' not work.
像“onStart”或“onClosed”这样的内置功能 Fancybox 不起作用。
I'm talking about version 1.3.0 RC2
我说的是 1.3.0 RC2 版本
回答by tillsanders
$.fancybox.isOpen(bool) indicates, whether fancybox is open.
$.fancybox.isOpen(bool) 表示fancybox 是否打开。
回答by Erik
The version your using apparently doesn't match the documentation; I looked at the source and saw the names of the options were different the the online docs. I just tested the following with 1.3RC2:
您使用的版本显然与文档不匹配；我查看了源代码，发现选项的名称与在线文档不同。我刚刚用 1.3RC2 测试了以下内容：
$(document).ready(function() {
function myStartFunction() { alert('fancy box opened'); }
$("a#inline").fancybox({
'onStart': myStartFunction
});
});
The option you're looking for is 'onStart' - the alert in myStartFunction goes off every time I open a box. I'm not sure when they changed the option but you can look at the source of any version you use at the bottom, and see what the option should be called.
您正在寻找的选项是“onStart”——每次我打开一个盒子时，myStartFunction 中的警报都会关闭。我不确定他们何时更改了选项，但您可以在底部查看您使用的任何版本的源代码，并查看应调用的选项。
EDIT
编辑
I just double checked on v1.2.5 - the version I use - and the callbacks are indeed named different. callbackOnStart works with 1.25 but, as I said, not 1.3
我只是仔细检查了 v1.2.5 - 我使用的版本 - 回调确实命名不同。callbackOnStart 适用于 1.25，但正如我所说，不适用于 1.3
回答by mola10
Try to use methods
尝试使用方法
beforeLoad, // Before loading
afterLoad, // After loading
beforeShow, // Before changing in current item
afterShow, // After opening
This code work fine
这段代码工作正常
$(".fancybox").fancybox({beforeShow:function(){alert('blah');}});
回答by Attila Fulop
If you're looking for a way to determine whether fancybox is open or not (instead of an event that is fired upon opening fancybox) then as of fancybox v2 you can use the $.fancybox.isOpenproperty. It's not documented (at least I didn't find any reference) but it works.
如果您正在寻找一种方法来确定fancybox 是否打开（而不是在打开fancybox 时触发的事件），那么从fancybox v2 开始，您可以使用该$.fancybox.isOpen属性。它没有记录（至少我没有找到任何参考）但它有效。
Example:
例子：
if(!$.fancybox.isOpen) {
$.fancybox.open({
href: '#newsletter-campaign-popup',
height: 385,
width: 510,
type: 'inline'
});
}
The example above prevents opening a second fancybox if one is already open.
如果一个已经打开，上面的例子防止打开第二个fancybox。
回答by Januz
I'm not sure what you mean by built-in functions. Fancybox has callbacks which call user-defined functions (that you must make yourself). Like:
我不确定您所说的内置函数是什么意思。Fancybox 具有调用用户定义函数的回调（您必须自己制作）。喜欢：
function myClose()
{
alert('close');
}
function myStart()
{
alert('start');
}
$("a#single_image").fancybox({
'callbackOnClose': myClose,
'callbackOnStart': myStart
// etc, etc..
});
Alternatively you could check the fancy_contentdiv to see if it has anything inside.
(if it has, then fancybox is open).
或者，您可以检查fancy_contentdiv 以查看其内部是否有任何内容。（如果有，则fancybox 是打开的）。
if ( $('#fancy_content:empty').length > 0 )
{
// Is empty
}
回答by Mike
this seems to work for me:
这似乎对我有用：
isLoaded : function(){
return $('#fancybox-content').html()!='';
}
回答by Peter Krejci
If you have multiple div's that you are using for fancybox, following code might be better and more universal solution:
如果您有多个 div 用于fancybox，以下代码可能是更好、更通用的解决方案：
if ($('.fancybox-opened').length == 0) {
//there is no fancybox opened at all
}
Note also that fancybox content might not be always empty, even if fancybox is closed.
还要注意，fancybox 内容可能并不总是空的，即使fancybox 已关闭。
回答by Y P
Answer for 2018 December.
2018 年 12 月的答案。
if ($('.fancybox-content').length == 0) {
//there is no fancybox opened at all
}
Details:
细节：
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/[email protected]/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/[email protected]/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>