Jquery 如何修改放大弹出窗口中的关闭按钮行为？_Jquery_Css_Magnific Popup

Jquery 如何修改放大弹出窗口中的关闭按钮行为？

jquery css

Jquery 如何修改放大弹出窗口中的关闭按钮行为？,jquery,css,magnific-popup,Jquery,Css,Magnific Popup,我已在弹出窗口之间创建了导航： .弹出窗口{ 位置：相对位置；背景色：rgba（255255,1）；填充：20px；宽度：自动；边框：1px实心#中交；最大宽度：500px；保证金：自动； } 变量html={ “a”：“a页转到b页”， “b”：“b页” }; 函数POUP（参数）{ 如果（！参数页）{ $.magnificPopup.instance.close（）；返回； } $.magnificPopup.open({ 项：{src:html[params.page]，键

我已在弹出窗口之间创建了导航：


.弹出窗口{
位置：相对位置；
背景色：rgba（255255,1）；
填充：20px；
宽度：自动；
边框：1px实心#中交；
最大宽度：500px；
保证金：自动；
}
变量html={
“a”：“a页转到b页”，
“b”：“b页”
};
函数POUP（参数）{
如果（！参数页）{
$.magnificPopup.instance.close（）；
返回；
}
$.magnificPopup.open({
项：{src:html[params.page]，键入：'inline'}，
回调：{
打开：函数（）{
$（“#page-a-button”）。单击（函数（）{
params.page='b'；
POUP（参数）；
});
},
后关闭：功能（）{
参数页={
“a”：空，
“b”：“a”
}[参数页]；
POUP（参数）；
}
}
});
}
点击我
$（“#按钮”）。单击（函数（）{
变量参数={
页面：“a”
};
POUP（参数）；
});

我遇到的问题是，真正的应用程序从需要一段时间才能到达的ajax调用中获取弹出窗口内容。然后，当用户单击closeX时，弹出窗口的关闭和打开都很烦人。在本例中，这不会发生，因为源是内联的

是否可以更改关闭触发器的关闭行为，使其不真正关闭弹出窗口，并让我通过编程方式完成此操作？

在的常见问题解答中，有一节名为“如何在不修改源文件的情况下覆盖某些功能？”。在这里，您应该找到如何覆盖关闭功能的答案

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="magnific-popup-0.9.9/magnific-popup.css" type="text/css" />
<style type="text/css">
    .popup {
        position: relative;
        background-color:rgba(255,255,255,1);
        padding: 20px;
        width: auto;
        border: 1px solid #cccccc;
        max-width: 500px;
        margin: auto;
    }
</style>
<script src="https://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="magnific-popup-0.9.9/magnific-popup.min.js" type="text/javascript"></script>
<script type="text/javascript">
    var html = {
        'a': '<div class="popup"><h1>Page a</h1><p><button id="page-a-button">Go to Page b</button></p></div>',
        'b': '<div class="popup"><h1>Page b</h1></div>'
    };
    function thePopup(params) {
        if (!params.page) {
            $.magnificPopup.instance.close();
            return;
        }
        $.magnificPopup.open({
            items: { src: html[params.page], type: 'inline' },
            callbacks: {
                open: function () {
                    $('#page-a-button').click(function () {
                        params.page = 'b';
                        thePopup(params);
                    });
                },
                afterClose: function () {
                    params.page = {
                        'a': null,
                        'b': 'a'
                    }[params.page];
                    thePopup(params);
                }
            }
        });
    }
</script>
</head>
<body>
<button id="the-button">Click me</button>
<script type="text/javascript">
    $('#the-button').click(function () {
        var params = {
            page: 'a'
        };
        thePopup(params);
    });
</script>
</body>
</html>