Javascript 是否加载jQuery移动对话框而不加载头？

在我的jQuery移动站点中，我的标题中有一个按钮，如下所示：

<a href="/foo.html" data-rel="dialog" data-icon="grid">Foo</a>

---

问题是JQM希望我用所有脚本和CSS重新定义头部。这是如此尴尬，尤其是对于一个对话框（更不用说慢）。我希望我的对话框只包含网格的内容，而不必重新定义完整的html页面。这可能吗？

您可以在同一页中定义对话框（多页布局）

HTML

文件：

---

这可能会在今后产生问题。如果通过AJAX导航到此页面，那么

data role=“dialog”

元素将被排除在外，因为jQuery Mobile只获取文档中的第一个

data role=“page”

或

data role=“dialog”

元素，而忽略文档的其余部分。感谢Phill和Jasper的帮助。我能够将数据角色从“dialog”更改为“page”，并按预期工作。我认为这是正确的做法：您不必在文档中包含任何内容，只需

…

。这就是jQuery Mobile将添加到DOM中的所有内容。不过，最好在每个文档中都有一个完整的SEO部分。如果用户刷新对话框，最好有一个完整的

部分。

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

<!-- Add the dialog here -->
<div data-role="dialog" id="theDialog">
    <div data-role="header" data-theme="d">
        <h1>Dialog</h1>
    </div>

    <div data-role="content" data-theme="c">
        <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="#thePage" data-role="button" data-rel="back" data-theme="b">Sounds good</a>       
        <a href="#thePage" data-role="button" data-rel="back" data-theme="c">Cancel</a>    
    </div>
</div>