jquery-mobile - "Masterpage"- 在 PhoneGap 应用程序中使用 jQuery Mobile 进行布局

Question

是否有可能在 jQuery Mobile 中创建类似母版页 (asp.net) 的内容？我正在开发一个移动应用程序(如果它很重要，则使用 phonegap)并且所有页面上都有相同的页眉和页脚(一些用于在应用程序中导航的按钮)。我想要做的是只创建一次这个页脚......而不是在每个 div(页面容器)中。

问候

编辑:这就是我想要的标记，但显示的只是没有页眉/页脚的 page1 或 page2

<div data-role="header">
        <h1>Header</h1>
</div>

    <div data-role="content">
        <div data-role="page" id="page1" data-title="Page 1">
            Page 1
        </div>
        <div data-role="page" id="page2" data-title="Page 2">
            Page 2
        </div>
    </div>

    <div data-role="footer" data-position="fixed">
        <table>
            <tr>
                <td>
                    <a href="#page1">Page 1</a>
                </td>
                <td>
                    <a href="#page2">Page 2</a>
                </td>
            </tr>
        </table>
    </div>

Answer 1

你可以看看这个很好的教程here其中解释了如何构建代码以便重复使用页眉和页脚。

它基本上创建了一个名为 Load 的包装器方法，它在给定位置(通常是您的内容占位符)将页面动态加载到 dom 中。