Question

我正在使用 PNotify 3 和 Bootstrap 3 。我正在尝试使用网站PNotify

上提供的示例

<button class="btn btn-default dropdown-toggle" onclick="(new PNotify({
                title: 'Confirmation Needed',
                text: 'Are you sure?',
                icon: 'glyphicon glyphicon-question-sign',
                hide: false,
                confirm: {
                    confirm: true
                },
                buttons: {
                    closer: false,
                    sticker: false
                },
                history: {
                    history: false
                },
                addclass: 'stack-modal',
                stack: {'dir1': 'down', 'dir2': 'right', 'modal': true}
            })).get().on('pnotify.confirm', function(){
                alert('Ok, cool.');
            }).on('pnotify.cancel', function(){
                alert('Oh ok. Chicken, I see.');
            });" data-toggle="dropdown">Modal Confirm Dialog</button>

一切正常但当我关闭对话框时点击任意按钮（Ok / Cancle）时，对话框会关闭，但页面不会像点击按钮之前那样变为正常状态。

在我调查解决这个问题的过程中，我发现，当我点击按钮PNotify时，在<body>标签下面添加一行：

<div class="ui-pnotify-modal-overlay" style="display: block;"></div>

关闭对话框后，PNotify将此代码块更改为：

<div class="ui-pnotify-modal-overlay" style="display: none;"></div>

表示显示：阻止更改为显示：无

但问题是，即使关闭项目中的对话框，PNotify也不会进行任何更改。

任何帮助将不胜感激。

Answer 1

虽然我无法得到任何回应。但是我自己得到了一个非公平的解决方案。使用以下代码：

        function undoModal() {
        var elements = document.querySelectorAll('body > *');
        if (elements[0].outerHTML == '<div class="ui-pnotify-modal-overlay" style="display: block;"></div>') {
            elements[0].remove();
        }
    }

Answer 2

即使您的undoModal现在可以使用，也无法保证它将适用于未来的PNotify版本。如果任何属性将附加到叠加层DIV - 它将停止工作。所以永远不要坚持使用元素的内容，而是使用更优雅的方法来删除不需要的元素：

function undoModal() {
    $(".ui-pnotify-modal-overlay").remove();
}

Answer 3

刚碰到这个，这是一个确认的错误。

[Confirm module]The black overlay is'nt removed when the history module isn't used #214

解决方法（目前）是在页面上加载历史记录模块。它可以在选项中打开或关闭，仍然有效。

history: { history: false }

通过工作，我的意思是它会在添加的display: none 上设置<div，但不会将其删除。

<div class='ui-pnotify-modal-overlay' style='display: none;'>

我试了一下，每个模态都在<body>标记之后留下了叠加div，所以它们只是堆积起来。

PNotify模态确认对话框使页面无法访问

3 个答案: