jQuery Mobile頁面/導航結構

我目前正在評估jQuery Mobile和PhoneGap的組合。對於我的應用程序，我需要一種「內部應用程序」導航模型：一個包含在各種上下文和函數之間切換的元素的固定頭，以及依賴於所選函數的整個區域。一個示例：用戶選擇一個客戶，然後可以在與該客戶有關的不同數據和統計視圖之間切換。或者，用戶可以在保持相同視圖的同時在不同的客戶之間切換。每個功能/視圖可能都是一個相當複雜的多頁面構造，並帶有自己的導航。jQuery Mobile頁面/導航結構

我想我現在理解jQuery Mobile的基本概念，但我不確定如何實現這個「正確的方式」。

我可以簡單地通過編碼與導航到每一個單頁的整個頭部做到這一點，但感覺就像一個非常糟糕的主意 - 大量的冗餘代碼，很多地方插入微小的錯誤，是很難找。
我可以嘗試將不同視圖的所有UI元素添加到單個頁面，隱藏它們並僅顯示屬於當前函數的元素。這也感覺不對 - 我懷疑DOM會非常大，我懷疑這可能會導致各種（性能）問題。
我可以嘗試使用jQuery DOM操作技術動態創建依賴於函數的頁面內容。這聽起來像個好主意，但單個頁面可能非常複雜，我擔心使用JavaScript生成大量複雜的HTML代碼會導致無法維護的代碼塊。
我可以嘗試組合這些方法 - 在HTML文件中編碼各個頁面，然後以某種方式將它們「鏈接」到使用DOM操作的適當位置 - 但我從來沒有這樣做過，而且我不確定是否以及如何可以得到這個工作。
我可以嘗試將「詳細信息」頁面放入iframe中 - 這項工作是否可行？

實現這種應用程序的最佳/規範方法是什麼？你知道任何教程或例子嗎？

來源

2011-10-16 vwegert

只需分離您的標題，然後將其重新附加到您的新頁面。例如：

$footer = $("#myfooter"); 
$header = $("#myheader"); 

$footer.detach(); 
$footer.appendTo('#newpage'); 
$header.detach(); 
$header.prependTo('#newpage'); 

$.mobile.changePage('#newpage');

拆卸並不能殺死所有的按鈕處理的/等，您將需要跟蹤的你是什麼網頁還是看的location.hash做靠的是什麼頁面不同的東西正在顯示。

--Greg框架
THEX互動
www.thexinteractive.com

來源

2011-10-20 13:51:12

只是爲了檢查它是否工作我已經做了相反的 - $（「＃集裝箱」），空（），然後$（。「#pagecontents」）。克隆（）。appendTo（「＃容器」）。兩種方法都有明顯的優勢/劣勢嗎？ – vwegert

第一種方法是最簡單的方法。我也是這麼做的。此外，您還可以自由添加特定於該頁面瀏覽區域中的內容的按鈕。
第二種方法將有額外的電話，你不想要的負載。其餘的方法是不值得的努力。

來源

2011-10-18 13:52:13 ghostCoder

jQuery Mobile頁面/導航結構

回答

相關問題