phonegap在android多個頁面

我是android中phonegap的新用戶。我正嘗試在一個html文件中創建一個包含多個頁面的項目，但它不起作用。我已經使用的代碼如下所示phonegap在android多個頁面

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>Page Title</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.5.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script> 
<body> 

<!-- Start of first page --> 
<div data-role="page" id="foo"> 

    <div data-role="header"> 
     <h1>Foo</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <h2>Foo</h2> 
     <p>I'm first in the source order so I'm shown as the page.</p>  
     <p>View internal page called <a href="#bar">bar</a></p> 
     <p>View internal page called <a href="#baz" data-rel="dialog" data-transition="pop">baz</a> as a dialog.</p> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 


<!-- Start of second page --> 
<div data-role="page" id="bar"> 

    <div data-role="header"> 
     <h1>Bar</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <h2>Bar</h2> 
     <p>I'm the bar page.</p>   
     <p><a href="#foo" data-direction="reverse">Back to foo</a></p> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 


<!-- Start of second page --> 
<div data-role="page" id="baz"> 

    <div data-role="header"> 
     <h1>Baz</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <h2>Baz</h2> 
     <p>I'm the baz page, viewed as a dialog.</p>   
     <p><a href="#foo" data-rel="back">Back to foo</a></p> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 

</body> 
</html>

請考慮這一點，我感謝所有幫助，將在這方面提供。

來源

2011-05-09 Ullas

「它不工作」有點模糊，你有什麼問題。我也假設jQuery Mobile，儘管你沒有這麼說。看到整個文檔也很好，所以我們可以發現任何問題。 – DarthJDG 2011-05-09 07:58:47

嗨，我使用此代碼創建多個頁面通過使用一個HTML文件.Bt我的輸出顯示在一個窗口中只有兩個頁面....pleasse幫助我在這... – Ullas 2011-05-09 11:58:40

每個頁面都需要用data-role ='page'封裝在div中。對於多個頁面，您還應該爲每個頁面添加一個ID。

例如，

<div data-role='page' id='page-foo'> 
    <div data-role="content"> 
    <h2>Foo</h2> 
    <p>I'm first in the source order so I'm shown as the page.</p>  
    <p>View internal page called <a href="#bar">bar</a></p> 
    <p>View internal page called <a href="#baz" data-rel="dialog" data-transition="pop">baz</a> as a dialog.</p> 
    </div><!-- /content --> 

    <div data-role="footer"> 
    <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div>

來源

2011-05-09 18:28:37 fynnbob

您需要

還爲每個頁面有一個數據角色類型一個div =頁面名稱唯一的ID，所有的頁面必須存儲具有相同的HTML文件調用

<a href="#page_id">bar</a> 



    <div data-role="page" id="foo" data-theme="b"> 
<div data-role="content"> 
    <h2>Foo</h2> 
    <p>I'm first in the source order so I'm shown as the page.</p>  
    <p>View internal page called <a href="#foo2">bar</a></p> 
    <p>View internal page called <a href="#foo2" data-rel="dialog" data-transition="pop">baz</a> as a dialog.</p> 
</div><!-- /content --> 

<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div> 



<div data-role="page" id="foo2" data-theme="b"> 
<div data-role="content"> 
    <h2>Foo2</h2> 

</div><!-- /content --> 

<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div>

來源

2011-09-04 09:51:46 Islam

在小提琴中正常工作。您的頁面佈局和jquery移動頁面佈局也似乎是正確的。

http://jsfiddle.net/dhavaln/Lbe6P/

來源

2012-03-07 11:25:58 dhaval

看來你錯過了</head>。

添加後，您的代碼工作正常。

來源

2012-06-17 05:15:17 Bohr

麥克道爾是正確的，你缺少的</head>標籤

此外，請確保您的.js和.css資源保存在本地和路徑對他們來說是相對的，不是絕對的。

改寫爲：

<link rel="stylesheet" href="jquery.mobile-1.0a3.min.css" /> 
<script src="jquery-1.5.min.js"></script> 
<script src="jquery.mobile-1.0a3.min.js"></script>

而且不要忘了PhoneGap的/科爾多瓦.js文件！

來源

2012-07-16 18:10:15 Erickaj

phonegap在android多個頁面

回答

相關問題