fancybox错误与触发器点击

我必须用我的网站上的触发器点击运行fancybox，我发现的问题是，如果点击花哨框内的元素，该方法将closures并再次出现（ 闪烁 ）。

我想fancybox防止闪烁，当我点击框内的元素，当我点击这些元素，我不想看到任何变化，那是所有:)

我为这个问题创build了演示

http://jsfiddle.net/NhWLc/5/

<div id="a1"> <p>Click on the box</p> <div class="r"></div> </div> $(document).ready(function() { $('#a1').fancybox({ afterClose: function() { console.log('closed :( '); } }).click();// or .trigger('click'); }); 

任何想法？

Answer 1

你的代码的问题是，你正在使select器#a1同时作为：fancybox的触发器和目标 ，因此任何点击本身将一遍又一遍地激发fancybox。

您将需要创build另一个select器（触发器），目标是#a1元素

 <a class="fancybox" href="#a1">triggers fancybox</a> <div id="a1"> <p>Click on the box</p> <div class="r"></div> </div> 

如果您不希望元素.fancybox可见，只需添加一个display:none属性即可

然后你的js

 $(document).ready(function () { $('.fancybox').fancybox({ afterClose: function () { console.log('closed :( '); } }).trigger('click'); }); 

请参阅JSFIDDLE

编辑 ：看着你的示例JSFIDDLE ，事情本来可以简单得多。

只有这个HTML

 <div id="a1"> <p>Click on the box</p> <div class="r"></div> </div> 

你可以使用这个代码

 $(document).ready(function () { $.fancybox({ href: "#a1" }); }); 

不需要click的地方。

看到你更新的JSFIDDLE

Answer 2

我不知道这会有帮助或不只是尝试这一点，

 $(document).ready(function(e) { e.preventDefault(); $('#a1').fancybox({ afterClose: function() { console.log('closed :( '); } }).click();// or .trigger('click'); }); 

Answer 3

使用下面的html，将id加到<div>和<a class="fancybox" rel="group" href="#r"><div id="r" class="r"></div></a>

 <div id="a1"> <p>Click on colors</p> <a class="fancybox" rel="group" href="#r"><div id="r" class="r"></div></a> <a class="fancybox" rel="group" href="#g"><div id="g" class="g"></div></a> <a class="fancybox" rel="group" href="#b"><div id="b" class="b"></div></a> </div> 

在这里检查

———————-更新—————-

添加afterShow（）到你的jQuery

 $('#a1').fancybox({ afterClose: function() { console.log('closed :( '); }, afterShow:function() { $('#a1').click(function(){return false;}); } }).click(); 

再检查一遍

Answer 4

我有一个不可点击的Fancybox覆盖相同的症状。 我的客户希望能够链接并自动打开某个Fancybox，如http://yoursite.com/#signup打开一个内联“注册”Fancybox叠加。; 感谢JFK，我意识到我正在触发并使用ID为'注册'的元素而不是具有'#signup'的href属性的元素。 我得到它钩到URL的最后部分（即#signup），并查找匹配的'a'href属性，并触发点击该元素。

下面的演示并没有真正帮助描述这个，但是你可以看到代码。

http://jsfiddle.net/ca7no4yp/2/

多汁的位：

 $("a[href='#" + location.href.substr(location.href.indexOf('#')+1) + "']").fancybox().trigger('click');