Magnific Popup:如何在弹出窗体中添加自定义关闭按钮？

Question

我有一个在弹出窗口中打开的表单,并在close button提交按钮旁边添加了自定义.

这是我用于关闭按钮的jQuery:

$(document).ready(function() {
    $('#close').click(function() {
        $.magnificPopup.close();
    });
});

然而,这似乎不起作用.有谁知道如何做到这一点？

Answer 1

如果您的代码段位于主js中,则ajax弹出按钮可能不会绑定到该事件.我想象两个解决方案:

使用"on"而不是"click":(未测试)

$('#close').on( "click", function() {
  $.magnificPopup.close();
});

或者那样做:(测试过)

在主js中添加此功能

function closePopup() {
  $.magnificPopup.close();
}

并在弹出的html中使用这种按钮

<button type="button" onClick="closePopup();">Close</button>

iframe:

如果您的按钮位于iframe中并且主窗口中的magnificpopup脚本位于同一域中,则可以像下面这样访问上述函数:

<button type="button" onClick="parent.closePopup();">Close</button>

Answer 2

尝试这个

<pre class="default prettyprint prettyprinted">
<code>

    $('#close').click(function(){
        $('.mfp-close').trigger('click');
      });

</code>
</pre>