Question

我正在尝试从没有成功的Dialog中打开一个Dialog。

这是我的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

Answer 1

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

这是一个弹出窗口中弹出窗口的小提琴 - ＆gt; http://jsfiddle.net/EWQ6n/520/

您可以删除已设置的onClick事件。

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

1 个答案: