Magnific Popup：从现有模态中打开新模态答案

【问题标题】：Magnific Popup: open new modal from existing modalMagnific Popup：从现有模态中打开新模态
【发布时间】：2014-07-28 11:26:16
【问题描述】：

我正在尝试实现以下内容：

我的登录表单显示为模式弹出窗口（带有Magnific Popup 插件）。在这个窗口中，我放了一个链接来打开一个新的弹出窗口（注册表单）。问题是，只要用户点击该链接 - 现有的弹出窗口就会关闭，但不会出现新的弹出窗口。

弹窗开启代码：

  $.magnificPopup.open({
                items: {
                    src: name
                },
                type: 'inline',
                closeMarkup: '<button title="%title%" class="mfp-close">&times;</button>',
                preloader: false,
                fixedContentPos: true,
                fixedBgPos: true,
                overflowY: 'auto'
            });

有什么建议吗？

提前谢谢你

【问题讨论】：

您确定您甚至正确地绑定了点击并且您实际上第二次调用了 $.magnificPopup.open 吗？考虑在弹出窗口中使用一些简单的标签脚本，在登录/注册之间切换。
@DmitrySemenov 看看这里：jsfiddle.net/nKognito/w4koj941。在打开的弹出窗口中调用 open 只会将其关闭而无需任何操作。
添加 event.stopPropagation()，popup 认为被点击的元素超出了边界，因为你通过 onclick 属性添加了事件监听器。
jsfiddle.net/DmitrySemenov/w4koj941/10
太棒了！将其发布为答案

标签： jquery magnific-popup

【解决方案1】：

callbacks: {
      open: function() {
        $('.new-ajax-popup-link').on('click', function(e) {
          e.preventDefault();
// close current popup
          $.magnificPopup.close();
          return false;
        });
      },
      afterClose: function() {
        // new popup instance
        var newAjaxPopupLink = $('.new-ajax-popup-link').magnificPopup({
          type: 'ajax'
      });
    // open it
        $('.new-ajax-popup-link').magnificPopup('open');
      }
}

【讨论】：

【解决方案2】：

在点击事件处理程序中添加event.stopPropagation()。弹出窗口认为单击的元素超出了界限，因为您在单击后通过打开新弹出窗口将其删除。

http://jsfiddle.net/DmitrySemenov/w4koj941/10/

【讨论】：