Javascript Fancybox：单击页面的任何部分时打开Fancybox

我正在尝试使用jQuery和在我的页面中实现一个简单的东西，但是我无法让我的代码正常工作

我需要创建一个代码，当用户点击页面的任何部分时，Fancybox会打开一个模式

目前，我的代码如下：

<script>
        $(document).ready(function(){
          $(document).click(function(e){
            $.fancybox.open([{
              href: '/welcome',
              title: 'Welcome to Our Website!'
            }],
            {
              width: 800,
              height: 600
            });
          });
        });
</script>

$（文档）.ready（函数（）{
$（文档）。单击（函数（e）{
$.fancybox.open([{
href:“/欢迎”，
标题：“欢迎访问我们的网站！”
}],
{
宽度：800，
身高：600
});
});
});

---

对我来说，代码很好，但是当我转到这个页面并点击页面的很多部分时，什么都没有发生。注意：控制台不显示任何错误消息，那么，我做错了什么

如果您希望fancybox在页面加载后（在用户可以与页面本身交互之前）在用户单击页面中的任何位置时打开，请尝试

---

请参见

是否先加载Fancybox的JavaScript代码？页面/欢迎页面是否显示了一些内容？您发布的代码工作正常，请参见此处的JSFIDLE：是的，我首先加载了Fancybox，并且/welcome是一个现有路径，它正在工作。我注意到的一件事是：当我尝试在一个按钮中实现这一点（以测试并查看问题是否与Fancybox有关）时，任何事情都会发生，并且在我的Chrome控制台的“网络”选项卡中会出现：“名称：欢迎|方法：获取|状态：（取消）|键入：待定”我认为这给了我们一个关于问题的提示。你知道这个错误说明了什么吗？试试

$（“body”）。单击（）

而不是

文档。另外，在fancybox API选项中添加
类型：“iframe”
。嘿，JFK，我在项目中更改了我想要的内容，现在我只要在单击输入或img时打开fancybox（现在正在工作）。但是别走，我看到你回答了这个问题：我试图跟随你的答案，但是当我点击模态外部时，我的Fancybox没有关闭，你能帮我吗/@费尔南多帕拉迪尼：这对你不起作用，因为现在你已经将fancybox绑定到了身体上（根据我的评论）。我将在这里发布一个解决这两个问题的答案。谢谢JFK！！你真的帮了我@JFK当我点击弹出窗口的关闭符号时，我想设置cookie。。我能做什么？在关闭后获得答案谢谢：function（）{here code for cookie}
jQuery(document).ready(function ($) {
    // add fancybox class to body on page load
    $("body").addClass("fancyopen");
    // bind click to body
    $(".fancyopen").on("click", function () {
        $.fancybox([{
            href: "/yourpage.html",
            title: "welcome to our website"
        }], {
            width: 300,
            height: 200,
            type: "iframe",
            afterShow: function () {
                $(".fancybox-wrap").on("click", function (event) {
                    event.stopPropagation(); // so you can click fancybox without calling it again
                });
            },
            afterClose: function () {
                $(".fancyopen").unbind("click").removeClass("fancyopen"); // now you can interact with the page
            }
        }); // fancybox
    }); // on
}); // ready