包括jquery移动多页网站中的页眉和页脚 [英] including the header and footer in jquery mobile multiple page site

问题描述

我创建一个jquery移动网络应用程序，其中包含3个页面，我的头/导航这些网页不更改，但在所有的示例中，我看到的页眉和页脚被添加到每个页面。可以只添加1个导航和1个页脚，然后只需切换页面的主要内容进出就像这样的结构：

I am creating a jquery mobile web app which contains 3 pages, my header/nav for these pages doesnt change but in all the examples Ive seen the header and footer is added to each page. Is it possible just to add 1 nav and 1 footer then just switch the pages main content in and out like this structure:

<div id="header" data-role="header"></div>
<div id="page1" data-role="page">content</div>
<div id="page2" data-role="page">content</div>
<div id="page3" data-role="page">content</div>
<div id="footer" data-role="footer"></div>

基本上有一种方法只显示/隐藏主要内容，

Basically is there a way of just showing/hiding the main content and doing nothing with the header and footer?

推荐答案

请参阅jQuery中的 load（）方法 - > http://api.jquery.com/load/

Have a look at the load() method in jQuery -> http://api.jquery.com/load/

这是一个例子：

$('#navigation').click(function() {
   $('#page1').load('page1.html');
});

这意味着当ID为导航，将调用 load（）函数，并替换的 div > page1 与已加载文件的内容。

This means that when something with an id of navigation is clicked it will call the load() function and replace the div with id of page1 with the contents of the loaded file.

这篇关于包括jquery移动多页网站中的页眉和页脚的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！