关闭前的精彩弹出操作

Magnific Popup action before close

本文关键字：操作 精彩      更新时间：2023-09-26

我已经在我的解决方案中实现了Magnific Popup，我正在使用Bootbox从用户那里获得确认，他想关闭窗口而不保存更改等。

我将我的自定义函数连接到关闭回调，但它没有按预期工作。

$('#divThumbnails').magnificPopup({
            delegate: 'a',
            type: 'inline',
            midClick: true,
            callbacks: {
                close: function () {
                    var confirm = bootbox.confirm('Are you sure?', function(result) {
                    });
                    if (confirm)
                        return true;
                    else
                        return false;
                }
            }
        });

这只是一个快速样本，而不是生产代码。if-else语句之所以存在，是因为否则Bootbox对话框无法显示（通常不需要检查返回值，因为它作为参数传递，在本例中称为result）。

问题是，在我点击关闭按钮后，我的图像（即弹出窗口的内容）消失了。我希望有机会取消关闭操作，并实现这一点，我需要一个将在关闭弹出窗口之前触发的事件。

这可以用华丽的弹出菜单实现吗？

  // this part overrides "close" method in MagnificPopup object
  $.magnificPopup.instance.close = function () {
      if (!confirm("Are you sure?")) {
          return;
      }
       // "proto" variable holds MagnificPopup class prototype
       // The above change that we did to instance is not applied to the prototype, 
       // which allows us to call parent method:
       $.magnificPopup.proto.close.call(this);
  };

http://codepen.io/dimsemenov/pen/edCgo

此代码只覆盖当前打开的弹出窗口！如果您在关闭后打开相同的弹出窗口，此回调将消失！

$.magnificPopup.instance.st.callbacks.close=function(){ 
  // your code here
  // this actually close popup
  $.magnificPopup.proto.close.call(this);
};
相关文章：