1
我已經創建的彈出窗口之間的導航：JS Fiddle如何修改Magnific Popup中的關閉按鈕行爲？
<!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>
我的問題是，真正的應用程序從需要一段時間才能到達ajax調用獲取彈出窗口內容。然後當用戶點擊關閉彈出窗口的關閉和打開令人討厭時。在JS Fiddle示例中，因爲源是內聯的，所以不會發生這種情況。
是否可以改變關閉觸發器的關閉行爲，以不真正關閉彈出窗口，並讓我以編程方式執行該操作？