Phonegap - jquery/jquery mobile只適用於應用程序的第一頁

我剛剛開始使用phonegap，我有兩個頁面index.html和pages.html， Index.html頁面包含owlslider和pages.html有移動swipeLeft and swiprRight功能。Phonegap - jquery/jquery mobile只適用於應用程序的第一頁

它適用於桌面瀏覽器，但是當我在Android模擬器或移動設備上測試它時，只有第一頁jquery正在工作。

即如果我把滑塊頁作爲索引比滑塊工作，但當我導航到滑動功能頁面比滑動功能不工作，如果我把滑動頁面作爲索引頁面比滑動工作，但如果我導航到滑塊頁面比它不工作。

我包括js文件按照HTML標準

<script src="js/jquery.mobile.min.js"></script>

和包括這個js在兩個頁面（即index.html，然後page.html中）

有沒有包括任何具體的方式js文件在phonegap項目？我錯過了什麼嗎？

我也使用phonegap的桌面版進行測試，但結果仍然一樣。

編輯

我發現從this答案，指出Can't use more then one data-role="page" inside any subsequent HTML page, only initial one can have more then one page.的東西，這就是爲什麼我的刷卡功能都沒有在第二頁的工作。但如何解決這個問題？如何使用data-role="page"在單頁中刷卡？因爲我想更改頁眉。

來源

2015-06-22 Nishant Solanki

此行爲可能是由index.html和pages.html之間的導航代碼導致的。請注意，jQuery Mobile使用頁面容器在多個HTML頁面之間導航。

JavaScript應該只添加到index.html，而pages.html應該只包含不同的HTML佈局。您的index.html應該是這樣的：

<html> 
    <head> 
     <script type="text/javascript" src="js/jquery.js"></script> 
     <script type="text/javascript" src="js/jquery.mobile.min.js"></script> 
    </head> 
    <body> 
     <div data-role="page" id="index"> 
      <div data-role="header"> 
       <h1>Login</h1> 
      </div> 
      <div data-role="main"> 
       <!-- Some html content here --> 
       <a href="pages.html">To the pages!</a> 
      </div> 
     </div> 
    </body> 
</html>

你pages.html應該具有相同的結構只是沒有JavaScript的應該被添加到HTML文件。該網頁的HTML文件應該是這樣的：

<html> 
    <head> 
     <title></title> 
    </head> 
    <body> 
     <div data-role="page" id="pages"> 
      <!-- Some html content here --> 
     </div> 
    </body> 
</html>

你也可以使用jQuery移動的JavaScript，如果你沒有錨頁面之間進行導航。 JavaScript很簡單，看起來像這樣：

jQuery.mobile.pageContainer.pagecontainer("change", "menu.html");

希望這有助於！

來源

2015-06-22 08:57:19 Dibran

讓我試試看..會回覆你..謝謝你的答案.. :) –

我做了一些RND，並得知如果你使用多個html頁面，你必須包含所有的js/css ，如果你使用的是單頁而不是你必須包括它們一次..檢查出來http://www.gajotres.net/multipage-template-vs-multi-html-template-in-jquery-mobile/和這個http://thehungrycoder.com/javascript-2/jquery/jquery-mobile/jquery-mobile-part-2-making-multiple-pages-and-linking-them.html –

我已經有一段時間了這個問題，但沒有時間看它。

今天早上在所有頁面上，什麼都不會將我移動的和JS/JQuery加載到Body/data-role =「page」div（在該頁面上，而不是在index.html頁面上）並且它工作正常。

所以試試看。

更多的解決方案和上面一個更好的解釋可以在這裏找到 - Why I have to put all the script to index.html in jquery mobile

讓我知道你上車，如果實在不行，我會繼續找你。

來源

2015-06-22 11:39:41 justsimpleshh

感謝您的答案..但問題是我在子頁面中使用了多個'date-role ='page''，所以這是不允許的。現在問題是我想要創建一個滑動頁面滑塊，它也改變頁眉和頁腳，但是通過使用一個單一的HTML網頁.. –

Phonegap - jquery/jquery mobile只適用於應用程序的第一頁

回答

相關問題