Jquery Mobile 不同页面上的相同页脚 [英] Jquery Mobile Same Footer on Different Pages

问题描述

我希望在我的 jquery 移动应用程序的所有页面上都有相同的页眉和页脚，并使用不同的文件(例如 footer.html)来控制它.这很容易使用 PHP 包含，但我不能，因为我计划将这个应用程序与 phonegap 一起使用.

搜索我发现使用

 
<div class="footerExt"></div>

和 JavaScript

$('.footerExt').load('footer.html')

然而这是行不通的.我应该提一下，我是 javascript 初学者，我几乎不明白发生了什么.

非常感谢

解决方案

尝试使用以下事件，它适用于我的代码:

$('[data-role=page]').live('pageshow', function (event, ui) {$("#" + event.target.id).find("[data-role=footer]").load("footer.html", function(){$("#" + event.target.id).find("[data-role=navbar]").navbar();});});

此gist 显示了整个代码.

I want to have the same header and footer on all pages on my jquery mobile app and control it using a different file for example like footer.html. This is easy to do use PHP include but I can't because I am planning on using this app with phonegap.

Searching around I found using

  <div data-role="footer">
<div class="footerExt"></div>
  </div>

and javascript

$('.footerExt').load('footer.html')

However this is not working. I should mention that I am javascript beginner, I barely understand what going on.

Thanks a lot

解决方案

Try with following event, it works with my code:

$('[data-role=page]').live('pageshow', function (event, ui) {
            $("#" + event.target.id).find("[data-role=footer]").load("footer.html", function(){
                $("#" + event.target.id).find("[data-role=navbar]").navbar();
            });
        });

This gist shows the entire code.

这篇关于Jquery Mobile 不同页面上的相同页脚的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！