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 个答案: