当您在 Modal 上按取消时，Magnific Popup 不会关闭答案

【问题标题】：Magnific Pop up wont close when you press Cancel on the Modal当您在 Modal 上按取消时，Magnific Popup 不会关闭
【发布时间】：2018-05-25 13:02:00
【问题描述】：

我在一个项目中使用 Magnific Pop up，目前我在一个 ASP MVC 项目中作为 Modal 使用它：

模态

div id="js_DeleteNewSongsPopup" class="theme-primary ajax-form popup-basic admin-form mfp-with-anim modalPopup">
<div class="panel">
    <div class="panel-heading">
        <span class="panel-title">
            <i class="fa fa-ban "></i>Reject Selected Song
        </span>
    </div>

    @* Information Body *@
    <div class="panel-body p25">
        <div class="section row">
            <div class="col-md-12 text-center">
                <h3>
                    Are you sure you want to <b class="text-danger">reject</b> the selected Songs?
                </h3>
                <p>
                    Please note, these will be <b class="text-danger">deleted</b> and no longer accessable
                </p>
            </div>
        </div>
    </div>

    @* Form Body *@
    <div class="panel-footer">
        <div class="text-center">
            <fieldset>

                    <input type="button" class="btn btn-primary js_CancelForm" value="Cancel" data-bind="click: function(){ $.magnificPopup.close(); }">
                    <input type="button" class="btn btn-danger js_DeleteNewSongsButton" value="Delete" data-bind="click: $root.submitDeleteNewSongs">
            </fieldset>
        </div>
    </div>

</div>

<button title="Close (Esc)" type="button" class="mfp-close">×</button>

JavaScript

/* Delete New Songs Popup*/
       $(document).on("click",
           ".js_DeleteNewSongs",
           function (e) {
               e.preventDefault();
               var popup = $("#js_DeleteNewSongsPopup");

               $.magnificPopup.open({
                   removalDelay: 500, //delay removal by X to allow out-animation,
                   items: {
                       src: $(popup)
                   },
                   callbacks: {
                       beforeOpen: function (e) {
                           this.st.mainClass = 'mfp-slideUp';
                       },
                       close: function () {

                       }
                   },
                   midClick: true
                   // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
               });
               return false;
        });

任何想法，因为没有报告控制台错误。当标记相同时，我也不确定为什么它在另一个页面上工作

【问题讨论】：

标签： javascript jquery magnific-popup

【解决方案1】：

试试：

$('body').removeClass('panel-body p25');

或者

$('body').removeClass('theme-primary ajax-form popup-basic admin-form mfp-with-anim modalPopup');

基本上你需要删除“modal”类。

【讨论】：

【解决方案2】：

最终使用：

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

现在弹出窗口按预期关闭。

【讨论】：