Jquery mobile 在JQuery Mobile中使用对话框

我正在开发JQuery移动应用程序。我的每个.html文件基本上都有一个

<div id="myPage" data-role="page">
  <!-- My Content -->
</div>

我的每一页都会有几个与之相关的对话框。因此，我认为将这些对话框定义包含在与其关联的页面所在的.html文件中是有意义的。但是，我看到的所有JQuery移动文档都在自己的.html文件中有对话框

有没有办法在与典型页面相同的.html文件中定义对话框？如果是，建议的方法是什么？我知道jquerymobile在DOM上做了一些聪明的事情，使它表现得如此出色。因此，我不确定我是否：

<div id="myPage" data-role="page">
  <!-- My Content -->

  <div id="myDialog" data-role="page" data-rel="dialog">
    <!-- My Dialog Conent -->
  </div>
</div>

或

---

即使这样，我也不知道如何以编程方式打开对话框。我在这里偏离基准了吗？

是的，您可以在同一页中包含对话框。e、 g

    <div data-role="page">
        <div id="content" data-role="content">
            <a href="#dialog1" id="some-dialog" data-rel="dialog" data-role="button">Open Dialog</a>
        </div>
    </div>

对话框标记：

   <div data-role="dialog" id="dialog1" class="app-dialog">
        <div data-role="header">
             <h3>A dialog</h3>
        </div>
            <div id="content" data-role="content">
                   <p>I am a dialog....!</p>
        </div>
   </div>

对话
我是一个对话者

有关更多信息，请访问。

对于“pop”转换，请在用于调用对话框的链接中添加data transition=“pop”。F.e

<a href="#dialog1" data-icon="info" data-rel="dialog" data-transition="pop">Help</a>

<a href="#dialog1" data-icon="info" data-rel="dialog" data-transition="pop">Help</a>