2

我的弹出窗口中有一些表单控件,如果表单无效,我想阻止用户关闭它。

我只是作为测试尝试过,但是当用户单击关闭按钮等时,弹出窗口仍然关闭。

$.magnificPopup.open({
            items: {
                src: '#topic'
            },
            type: 'inline',
            removalDelay: 500, //delay removal by X to allow out-animation
            mainClass: 'mfp-3d-unfold',
            closeMarkup: '<button title="Close (Esc)" type="button" class="mfp-close"></button>',
            midClick: true, // Allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source in href.
            callbacks: {
                beforeClose: function () {
                    // Callback available since v0.9.0
                    return false;
                },
                close: function () {
                    // Will fire when popup is closed
                    return false;
                }
            }
        });
4

2 回答 2

3

根据文档,如果您添加closeOnContentClick: false为选项,则窗口不应关闭。

magnificPopup.open({
            items: {
                src: '#topic'
            },
            type: 'inline',
            closeOnContentClick: false,
            removalDelay: 500, //delay removal by X to allow out-animation
            mainClass: 'mfp-3d-unfold',
            closeMarkup: '<button title="Close (Esc)" type="button" class="mfp-close"></button>',
            midClick: true
        });

但是,我一直试图让一个 ajax 窗口在其中有点击(表单)时不关闭,并且添加此选项根本不起作用(它可能适用于内联)。到目前为止,我能够让它工作的唯一方法是向mfp-prevent-close弹出窗口中的所有子节点添加一个类(例如,所有表单输入字段、周围的字段集等)。

无论如何希望这会有所帮助:)

于 2013-10-25T06:24:32.447 回答
0

我终于在GitHub 上找到了解决方案

您需要替换以下代码行

// if click is outside the content
if( (target !== mfp.content[0] && !$.contains(mfp.content[0], target)) ) {

// if click is outside the content
if( (target !== mfp.content[0] && !$.contains(mfp.content[0].parentElement, target)) ) {

它为我解决了这个问题。

于 2016-01-02T15:30:54.040 回答