包括頁眉和頁腳在jQuery的移動多頁面網站

我正在創建一個包含3頁的jquery移動web應用程序，我的頁眉/導航這些頁面不會改變，但在所有的例子中，我見過的頁眉和頁腳被添加到每頁。是否有可能只是爲了加1個導航和1個頁腳然後就切換頁面進出這樣的結構，主要內容是：包括頁眉和頁腳在jQuery的移動多頁面網站

<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>

基本上是那裏只是顯示/隱藏的主要內容，並與無爲的方式頁眉和頁腳？

對此有何意見將是巨大的凱爾

來源

2011-11-25 styler

看一看jQuery中的load()方法 - >http://api.jquery.com/load/

這裏是一個〔實施例：

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

這意味着，當某事點擊一個ID爲navigation它會調用load()函數並替換div的ID爲page1機智h加載文件的內容。

來源

2011-11-25 14:21:57 ManseUK

不，不幸的是，JQM不支持這個（還），你需要在EVERY角色頁面上添加你的role = header和role = footer（所有這3個頁面）。

見documentation

我會堅持到$ .mobile.changePage（），因爲這需要照顧散列和很多其他活動，而不僅僅是使用jQuery .load（）新內容...

希望這有助於

來源

2011-11-30 10:56:07 Leon

這是jquery.mobile開發商的正確答案。 – sonjz

這應該是接受的答案。 –

你可以在jQuery的

使用.load（）例如在每一個頁面，你都會有這樣的：

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

現在建立這個功能：

function goTo(pageURL, transitionType) { 
    $.mobile.changePage(pageURL, transitionType); 
    $('.ui-footer').load('assets/includes/footer.html'); 
}

現在，當你在頁面之間移動，嘗試的onclick（或代碼，如果你喜歡）電話：

goTo('home.html','slideup');

，會做的伎倆（這是我使用的）

你也可以對標題做同樣的操作。

請記住，如果頁眉或頁腳內容爲應用程序的每個版本（例如本地化）更改，則必須先調用此內容，然後填寫本地化文本或其他任何內容。

我希望這有助於你的目的

來源

2012-05-13 20:07:04 EMMNS

包括頁眉和頁腳在jQuery的移動多頁面網站

回答

相關問題