如何通过beforeClose回调取消打开弹窗？#神奇-弹窗

Question

我正在使用一个带有beforeClose回调的MagnificPopup，我想根据条件取消它的打开。我该怎么做呢？

我尝试了返回false或$.magnificPopup.close();，但它仍然打开...

我相信有一个基本的解决方案！

谢谢

Answer 1

这有点棘手，但你可以通过在初始化时直接打开弹出窗口来实现：

var popupDefaults = {
    type: 'inline',
    fixedContentPos: false,
    fixedBgPos: true,
    overflowY: 'auto',
    closeBtnInside: true,
}

$('.open-popup-link').on("click", function(){
    var condition = false;
    if(!condition){
      $(this).magnificPopup(popupDefaults).magnificPopup('open');
    }
});

fiddle

如果将条件更改为true，弹出窗口将不会打开。

Answer 2

如果您的条件为真，那么您可以做的就是覆盖创建弹出窗口的javascript函数。像这样：

var originalOpen = window.open;
if (condition) {
    //prevent open new window
    window.open = function(){return null;};
}

// after window open attempt
window.open = originalOpen

您可以使用alert和任何类型的消息框来完成此操作。

另一种方法是修改magnificPopup...

Answer 3

使用

disableOn: function(){
    if ($(window).width() <= 768){
        return false;
    }
    return true;
}

(可选)：这不会停止触发弹出窗口的DOM元素的默认行为。

如果您使用的是在弹出中加载Youtube视频的锚定标记，则为

• disableOn将阻止弹出窗口打开
• 浏览器将遵循锚定标记的href!

要阻止这种情况发生，请在DOM元素的click处理程序上添加额外的检查：

// Stop an anchor tag's default behavior
// Otherwise if it's a Youtube video, clicking this DOM element will land users on Youtube
$("a.my-popup").on("click", function(){
    if ($(window).width() <= 768){
        return false;
    }
});