Question

我有一个网站并以下列方式使用fancybox：

    $(document).ready(function() {
    // Fancybox
    $("#lightbox").fancybox({
        closeBtn : false,
    });
}); 

function openLightBox(){
    $('#lightbox').click();
}

我已将灯箱设置为从css隐藏，当我点击菜单项时，它会打开灯箱登录

fancybox打开很好但是当我尝试点击块内的内容时，它表现得很奇怪，并在其上触发另一个点击事件。您可以看到访问以下link的问题，然后点击底部菜单项“安全登录”，然后点击灯箱内容中的某个位置。

有人能告诉我如何解决这个问题吗？感谢

Answer 1

在您的网站上，您使用以下方式调用fancybox：

<li><a href="javascript:void(0);" onclick="openLightBox();">Secure Login</a></li>

指向openLightBox（）函数的链接：

function openLightBox(){
    $('#lightbox').click();

你也使用：

$(document).ready(function() {
    // Fancybox
    $("#lightbox").fancybox({
        closeBtn : false,
    });
});

这些都是不必要的。您在第一个<li>中所需要的只是一个ID，并使用href链接到<div id="lightbox">，您可以使用该<li><a href="#lightbox" id="linky">Secure Login</a></li>来调用fancybox：

$("#linky").fancybox();

然后你需要做的就是设置fancybox来对这个id进行操作：

$("#linky").fancybox({
    'width' : '90%',
    'height' : '90%'

您可以在上面设置要使用的任何设置，例如：

{{1}}

}）;

这是您放置代码以删除关闭按钮的位置。

请参阅此jsfiddle以获取使用代码片段的示例（我没有隐藏灯箱div，但您的方式与以前相同：在CSS中）多数民众赞成就是这样！

jquery fancybox内容点击问题

1 个答案: