JQuery：將多個頁面合併爲一個

我正在使用phonegap和jQuery Mobile開發應用程序。 Phonegap建議使用單個文檔結構。由於文檔中的5個div或更多不清楚，我試圖將我的頁面（div的）分成多個文檔。一旦phonegap加載應用程序，我想插入這些文件到index.html。JQuery：將多個頁面合併爲一個

function loadPage(external_document) { 
    var docname=external_document+".html"; 
    $.get(docname, function(data) { 
     console.log(docname+" loading"); 
     $("body").append($(data).find("body")); 
     $("head").append($(data).find("head")); 
     console.log(docname+" loaded"); 
    }); 

} 

document.addEventListener("deviceready", function(){ 
    loadPage("DialogCredentials"); 
}, false);

DialogCredentials.html

<html> 
<head> 
    <script type="text/javascript" src="js/DialogCredentials.js"></script> 
</head> 
<body> 
    <div data-role="page" id="dlg_credentials"> 
    <div data-role="header"><h1>Login</h1></div> 
    <div data-role="content"> 
    ... 
</div> 
</div><!-- /page --> 
</body> 
</html>

只要loadPage被執行應該有一個<div id="dlg_credentials"…和相應的在我的主文檔的DOM JavaScript代碼。但事實並非如此。網絡檢查員沒有顯示錯誤。那麼我在這裏做錯了什麼？

來源

2012-09-18 gorootde

沒有，建立一個測試用例你，如果你真的想分開你的網頁，讓您的編碼更容易，我會建議加載網頁的標準方式爲jQuery Mobile的即

$.mobile.changePage("about/us.html", { transition: "slideup"});

這樣你沒有重新發明輪子，它滿足您的要求。在任何情況下，相比於您提出的解決方案，開銷將可以忽略不計，更不用說考慮到您希望第一頁快速呈現，而不是在任何情況下呈現任何html之前插入許多頁面來阻止。由於它們將在設備上位於本地，因此Phonegap將能夠很快爲其提供服務。

一件事通過jQuery Mobile的加載頁面時，需要記住的是，它剔除了在目標頁面什麼的

data-role="page|dialog|popup"

標籤之外，因此加載自定義頁面特定的JavaScript，我會建議你包括腳本標籤正下方的

data-role="page"

開放標籤，並設置「pageinit」

<div data-role="page" id="options" data-theme="a"> 
<script type="text/javascript"> 
    $(document).bind('pageinit', initializeOptions()); 
    function initializeOptions() { 
     // do your page initialization here . . . 
    } 
</script> 
<!-- rest of page continues here . . . . -->

發生任何頁面初始化

然後根據需要繼續處理頁面的其餘部分。這樣，當頁面通過$ .mobile.changePage方法加載時，它將被解析。

希望有所幫助。

來源

2012-09-18 20:20:09

動態加載是幾個Javascript框架的一個特性。例如AngularJS和Backbone.js。也許看看他們的方法來加載多個視圖？

我以前曾經在一個應用程序中做過這樣的工作，在index.html中爲每個視圖添加一個空的div，然後根據需要動態加載每個視圖的Javascript。視圖的Javascript負責將HTML呈現爲該視圖的div。

來源

2012-09-18 15:18:50

JQuery：將多個頁面合併爲一個

回答

相關問題