jQuery弹出超过弹出

Question

我有一个使用打开的jQuery弹出窗口。

$('#id').popup('open');

上面的弹出窗口包含一个图像，该图像的onclick函数应在上一个弹出窗口上方再打开一个弹出窗口，同时保留上一个弹出窗口，第二个弹出窗口与先前打开的弹出窗口重叠。

尝试了stackoverflow，代码笔等上的所有可用选项。

Answer 1

我遇到过这种情况，我发现通常两个弹出窗口一个接一个的并不是实现良好的最终用户交互的最佳解决方案，尤其是如果您不希望用户同时与两个弹出窗口进行交互时。

我建议您一个简单的解决方案，可以为您提供帮助：

您可以将您的弹出窗口结构视为多个弹出窗口的容器，这些弹出窗口全部隐藏，并在需要时通过javascript显示。

例：

jsFiddle

    <body>

    <div id="popup">

        <section class="show">
            <h1> Hello i'm the content of the first popup </h1>
            <p> Please assume that i'm an actual popup as my actual structure it's not important for this example</p>
        </section>
        <section>
            <h1> Hello i'm the content of the <strong>second</strong> popup </h1>
            <p> Please assume that i'm an actual popup as my actual structure it's not important for this example</p>      
        </section>
        <div class="button">Switch Popups</div>
    </div>
</body>

$(document).ready(function () {
    $(".button").on("click", function () {
        $("#popup")
            .find(".show")
            .removeClass("show")
            .insertBefore(".button");

        $("#popup").children("section").eq(0).addClass("show");

    });
});

Answer 2

https://jsfiddle.net/fd4o3o6s/

我编写了自己的弹出代码。

以下代码应该可以在另一个弹出窗口之上打开一个弹出窗口，

var buttons = [{text:"Close popup"},{text:"Open second popup", value:true, close:false}];
var buttons2 = [{text:"Close popup"}];

new popup(buttons, "First popup", "<p>Some text.</p>").open().progress(function(r) {
    if(r) {
        new popup(buttons2, "Second popup", "<p>Some text.</p>").open();
    }
});

jQuery弹出超过弹出

问题描述

2 个解决方案

解决方案1
3 2014-05-27 14:48:01

解决方案2
0 2016-01-07 17:48:27

jQuery弹出超过弹出

问题描述

2 个解决方案

解决方案1 3 2014-05-27 14:48:01

解决方案2 0 2016-01-07 17:48:27

解决方案1
3 2014-05-27 14:48:01

解决方案2
0 2016-01-07 17:48:27