Jquery 同一按钮的关闭模式

我使用以下jquery弹出一个全屏覆盖模式。我的菜单有一个更高的z指数，所以它总是在所有东西的顶部。问题是，我希望能够用启动它的相同按钮关闭我的模态。现在它只是重新加载模态。我试图更改

$（[rel=modal]）

，使其关闭（modalId）；，但没有效果。谢谢

，代码：

（函数（$）{
$.fn.modal=函数（）{
var t=Math.floor（$（“body”）.scrollTop（）；
var bg=$（“”）；
$（“正文”）。追加（bg）；
$（“#模态bg”）.css({
“位置”：“固定”，
“背景”：“rgba（0,0,0,0.7）”，
“顶部”：0，
“左”：0，
“高度”：“100%”，
“宽度”：“100%”，
“z指数”：100，
“不透明度”：0
});
美元（“#模态bg”）。法德托（200,1）；
var modalId=$（this.attr（“href”）；
$（modalId）.css({
“显示”：“块”，
'位置'：'固定'，
'左'：（$（window.width（）-$（modalId.outerWidth（））/2），
“top”：（$（window.height（）-$（modalId.outerHeight（））/2），
“不透明度”：0，
“z指数”：200
});
美元（modalId）.fadeTo（200,1）；
$（窗口）.scrollTop（t-（$（窗口）.height（）-$（modalId.outerHeight（））/2）+1）；
$（“#模态bg”）。单击（函数（）{
关闭（莫达利德）；
});
};
$（“a[rel=modal]”。单击（函数（）{
$（this.modal（）；
});
功能关闭（id）{
$（id）.css（'display'，'none'）；
美元（“#模式背景”）。淡出（200）；
setTimeout（function（）{$（“#modal bg”）.remove（）；}，200）；
};
})（jQuery）；

为什么不在单击事件中检查DOM中是否有模态

---

这样背景会很好地关闭，但内容在静止后仍然可见。

(function( $ ){

$.fn.modal = function() {
    var t = Math.floor($("body").scrollTop());
    var bg = $("<div id='modal-bg'></div>");
    $("body").append(bg);
    $("#modal-bg").css({
        "position": "fixed",
        "background": "rgba(0,0,0,0.7)",
        "top": 0,
        "left": 0,
        "height": "100%",
        "width": "100%",
        "z-index": 100,
        "opacity": 0
    });
    $("#modal-bg").fadeTo(200, 1);

    var modalId = $(this).attr("href");
    $(modalId).css({
        'display': 'block',
        'position': 'fixed',
        'left': (($(window).width() - $(modalId).outerWidth()) / 2),
        'top': (($(window).height() - $(modalId).outerHeight()) / 2),
        'opacity': 0,
        'z-index': 200
    });
    $(modalId).fadeTo(200, 1);
    $(window).scrollTop(t - (($(window).height() - $(modalId).outerHeight()) / 2) + 1);

    $("#modal-bg").click( function() {
        close(modalId);
    });
};

$("a[rel=modal]").click( function() {
    $(this).modal();
});

function close(id){
    $(id).css('display', 'none');
    $("#modal-bg").fadeOut(200);
    setTimeout( function() {$("#modal-bg").remove();}, 200);
};

})( jQuery );

$("a[rel=modal]").click( function() {
    if ($("#modal-bg").length) {
        close();
    } else {
        $(this).modal();
    }
});