1

我不明白为什么这个对话框不起作用。我正在使用 jqm 1.3

<a href="#foo" data-rel="dialog">Open dialog</a>

<div id="foo" data-role="dialog">
    <div data-role="header" data-theme="d">
        <h1>Dialog</h1>
    </div>
    <div data-role="content">
        <h1>Delete page?</h1>
        <p>This is a regular page, styled as a dialog. To create a dialog, just link to a normal page and include a transition and <code>data-rel="dialog"</code> attribute.</p>
        <a href="dialog/index.html" data-role="button" data-rel="back" data-theme="b">Sounds good</a>       
        <a href="dialog/index.html" data-role="button" data-rel="back" data-theme="c">Cancel</a>    
    </div>
</div>

我在“头”上加了

<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js>

和其他 jqm 事件正在工作。

4

1 回答 1

2

您需要包装您的锚标记，该标记在页面 div 中调用对话框，如下所示。

<div data-role="page">
    <div data-role="content">
<a href="#foo" data-rel="dialog">Open dialog</a>
    </div>
</div>

<div id="foo" data-role="dialog">
    <div data-role="header" data-theme="d">
        <h1>Dialog</h1>
    </div>
    <div data-role="content">
        <h1>Delete page?</h1>
        <p>This is a regular page, styled as a dialog. To create a dialog, just link to a normal page and include a transition and <code>data-rel="dialog"</code> attribute.</p>
        <a href="dialog/index.html" data-role="button" data-rel="back" data-theme="b">Sounds good</a>       
        <a href="dialog/index.html" data-role="button" data-rel="back" data-theme="c">Cancel</a>    
    </div>
</div>

您可以在以下位置查看示例Live fiddle

于 2013-04-02T09:12:26.297 回答