在 JQuery Mobile 的对话框中打开对话框答案

【问题标题】：Opening Dialog from within a Dialog in JQuery Mobile在 JQuery Mobile 的对话框中打开对话框
【发布时间】：2014-02-05 18:03:20
【问题描述】：

我试图从对话框中打开一个对话框，但没有成功。

这是我的html：

<a href="#popupDialog" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-transition="pop" data-icon="delete" data-theme="b">Delete page...</a>
<div data-role="popup" id="popupDialog" data-overlay-theme="a" data-theme="c" data-dismissible="false" style="max-width:400px;">
    <div data-role="header" data-theme="a" class="ui-corner-top">
        <h1>Delete Page?</h1>
    </div>
    <div data-role="content" data-theme="d" >
        <h3 class="ui-title">Are you sure you want to delete this page?</h3>
        <p>This action cannot be undone.</p>
        <a href="#" data-role="button" data-rel="back" data-theme="c">Cancel</a>
        <a data-role="button" data-rel="back" data-transition="flow" data-theme="b" onclick="NewDialog();">Open New Dialog</a>
    </div>
</div>


<div data-role="popup" id="popupDialog1" data-overlay-theme="a" data-theme="c" data-dismissible="false" style="max-width:600px;">
    <div data-role="header" data-theme="a" class="ui-corner-top">
        <h1>Top Delete Page?</h1>
    </div>
    <div data-role="content" data-theme="d" >
        <h3 class="ui-title">Dialog Called from A Dialog</h3>
        <p>This action cannot be undone.</p>
        <a href="#" data-role="button" data-rel="back" data-theme="c">Option-1</a>
        <a href="#" data-role="button" data-rel="back" data-transition="flow" data-theme="b">Option-2</a>
    </div>
</div>

这是一个小的 js 函数：

function NewDialog()
{
    //alert("Alert-1");
    ("#popupDialog1").popup("open");

}

知道如何成功调用第二个对话框吗？

JS Fiddle is here

【问题讨论】：

标签： javascript jquery dialog popup

【解决方案1】：

您需要设置first popups 第二个按钮，即open new dialog 以弹出。并将其设置为data-rel 而不是data-rel="back" 将其设置为data-rel="popup" 并提供对您要弹出的内容的引用，即href --> href="#popupDialog1"

这是一个在弹出窗口中带有弹出窗口的小提琴 --> http://jsfiddle.net/EWQ6n/520/

顺便说一句，您可以删除您已设置的 onClick 事件。

【讨论】：