相关疑难解决方法(0)

在jQuery Mobile和PhoneGap中创建模板化/持久性页眉/页脚模板

我正在尝试用jQuery Mobile/PhoneGap编写移动应用程序.我正在使用此示例模板开始,它使用HTML/JS来创建页面.他没有将所有<page>标签放在一个单独的html文件中,而是将其拆分,以便更容易编辑.

由于每个页面都有一个单独的文件,包含标题页眉/页脚的最佳方法是什么?我只看到你需要将整个页脚 - >导航栏代码复制并粘贴到每个HTML页面的位置.这似乎不应该是.例如,如果要更改一个菜单项,则需要进入每个页面并进行更改.

我缺少什么解决方案?

也许我只是不理解jQuery Mobile.例如,他们用于文档的侧边栏 - 侧边栏代码是否复制并粘贴到每个页面上?这没有意义.这与我在这里询问有关页脚的问题是一样的.

http://jquerymobile.com/test/docs/pages/page-cache.html

这就是我所拥有的那些似乎不对(并且$.live('pageinit')不起作用).这个HTML是每个HTML页面上的内容:

<div id="mainFooter" data-position="fixed" data-id="mainFooter" data-role="footer" class="ui-footer ui-bar-a ui-footer-fixed fade ui-fixed-inline" role="contentinfo" style="top: 58px;">
Run Code Online (Sandbox Code Playgroud)

和JS

$.live('pageinit', function (event) {
    displayFooter();
});

function displayFooter() {
    $('#mainFooter').html('<div data-role="navbar" class="nav-glyphish-example" data-grid="d">' +
        '<ul>' +
        '<li><a href="#" id="menuitem1" data-icon="custom">Menu Item 1</a></li>' +
        '<li><a href="#" id="menuitem2" data-icon="custom">Menu Item 2</a></li>' +
        '<li><a href="#" id="menuitem3" data-icon="custom">Menu Item 3</a></li>' +
        '</ul>' +
        '</div>');
}
Run Code Online (Sandbox Code Playgroud)

jquery footer jquery-mobile cordova

61
推荐指数
1
解决办法
2万
查看次数

标签 统计

cordova ×1

footer ×1

jquery ×1

jquery-mobile ×1