Jquery Lightbox未显示

我对jquery和stackoverflow都是新手

我试图自己创造一个灯箱。我已经成功地使用jquery添加了lightbox结构，如下所示

var patch= $(
        '<div id="Adi-patch" style="position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.9); text-align: center; color: white;"></div>');
    $("#wrapper").before(patch);
    patch.html(
        '<span id="Adi-close-btn" style="position: absolute; right: 1em; font-size: 2em; color: white; cursor: pointer;">&#9587;</span>\
        <div id="Adi-content" style="background: gray; position: relative; left: 50%; margin-left: -25%; width: 50%; height: 90%; overflow: hidden;"></div>\
        <div id="Adi-prev-btn" style="background: black; position: absolute; top: 50%; font-size: 2em; margin-top: -1em; padding: 5px; cursor: pointer;">&#10094;</div>\
        <div id="Adi-next-btn" style="background: black; position: absolute; top: 50%; right: 0px; font-size: 2em; margin-top: -1em; padding: 5px; cursor: pointer;">&#10095;</div>\
        <div id="Adi-caption" style="padding: 5px;">Sample caption</div>'
    );
    patch.css({"display": "none"});

var补丁=$(
'');
$（“#包装”）。在（补丁）之前；
patch.html(
'╳\
\
❮\
❯\
示例标题'
);
css（{“display”：“none”}）；

但是，我一直在展示点击事件的内容。我试过

<!-- Show Lightbox structure on anchor click event   -->
    $('#wrapper a').click(function(){
        patch.fadeToggle();
    });

$（'#包装器a'）。单击（函数（）{
patch.fadeToggle（）；
});

问题是这个结构只是忽隐忽现。它不会停留在那里。请建议我应该如何解决这个问题。或者，如果已经讨论过，请告诉我解决方案

---

提前感谢。

发生此错误是因为您的超链接为空，重定向到同一页面

您可以使用多个占位符，如果您进行搜索，您将在此处找到大量关于最佳选项的讨论。大多数人只使用“#”，但请注意它会自动将您滚动到页面顶部

不要忘记将同一个侦听器添加到“关闭”按钮：

$('#wrapper a, #Adi-close-btn').click(function() {
  patch.fadeToggle();
});

---

创建一个JSIDLE。如果不看到html，就很难调试代码。我对JSFIDLE也是新手，但是我做了一个尝试，你会看到，结果增加了lightbox结构，但它很快就消失了。非常感谢。它成功了。但我不明白，为什么链接的默认行为必须是这样。或者换句话说，这根本不是直觉。你能分享一些关于理解这种特殊方法的逻辑的在线教程吗。