JQuery Mobile Phone gap：使用asyraf9示例不起作用的分割視圖

我想在iPad中使用jQuery Mobile和PhoneGap實現分割視圖。許多網站推薦asyraf9的https://github.com/asyraf9/jquery-mobile/JQuery Mobile Phone gap：使用asyraf9示例不起作用的分割視圖

我已經下載了zip文件，它有文件包在裏面。在文件夾demos\experiments\我看到了一個「splitview」目錄。我使用該目錄的內容作爲參考。

我已經添加了使用我的www文件夾中拆分視圖文件夾中的文件的所有文件。它顯示僅變化波紋管所示，當我們使用「&副本CS8」

任何語法概率在「&副本，如圖波紋管的視圖，但不能拆分視圖

而且在index.htms代碼的某些部分CS8「

enter image description here

的哪個文件中要被用作插入的拆分視圖..？

，當我用它的分裂觀點index.html文件，它不會顯示拆分視圖

它就像一個段與表視圖爭奪，但不能拆分視圖

enter image description here 什麼錯

來源

2012-05-28 Vijay

在index.html，看看你有兩個div，一個有data-role =「menu」，另一個是data-role =「main」。所以，一旦你擁有了它，在肖像模式下你就可以顯示主頁了。在橫向模式下，您將顯示菜單和主頁。

您可以通過刪除&複製代碼來檢查，以驗證在沒有相同的情況下，您是否能夠獲得分割視圖。

來源

2012-08-02 12:41:31 Balaji

您的意思是'data-id ='menu''？事實上，它在桌面上的Web瀏覽器中運行良好，只有當我使用PhoneGap在Android上創建應用程序時纔會出現問題。這裏是我的index.html：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Jquery Mobile Splitview</title> 
     <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"> 
     <link rel="stylesheet" href="css/jquery.mobile.css" /> 
     <link rel="stylesheet" href="css/jquery.mobile.splitview.css" /> 
    <link rel="stylesheet" href="css/jquery.mobile.grids.collapsible.css" /> 
    <script type="text/javascript" src="js/jquery-1.7.1.js"></script> 
    <script type="text/javascript" src="js/jquery.mobile.splitview.js"></script> 
    <script type="text/javascript" src="js/jquery.mobile.js"></script> 
    <script type="text/javascript" src="js/iscroll-wrapper.js"></script> 
    <script type="text/javascript" src="js/iscroll.js"></script> 
    <!--script type="text/javascript" src="scrollability.js"></script-->   
</head> 
<body> 
    <div data-role="panel" data-id="menu" data-hash="crumbs" data-context="a#default"> 
     <!-- Start of main page --> 
     <div data-role="page" id="main" data-hash="false"> 
      <div data-role="header"> 
       <h1>Left panel</h1> 
      </div><!-- /header --> 
      <div data-role="content"> 
       The left content 
      </div><!-- /content --> 
     </div><!-- /page --> 
    </div><!-- panel menu --> 

    <div data-role="panel" data-id="main"> 
     <!-- Start of about page --> 
     <div data-role="page" id="about"> 
      <div data-role="header"> 
       <h1>Right panel</h1> 
      </div><!-- /header --> 
      <div data-role="content"> 
       The right content 
      </div><!-- /content --> 
     </div><!-- /page --> 
    </div><!-- panel main --> 
    </body> 
</html>

看來PhoneGap的不支持此插件。

謝謝你的好意

來源

2012-08-02 14:12:43 user1570943

，使之成爲splitsview工作..在Splitsview.js文件使

$.support.splitview =($query || ($.mobile.browser.ie && $(this).width() >= 480)) 
         && $.mobile.ajaxEnabled;

爲（評論右側做$ .support.splitview = 1; ）

$.support.splitview = 1;//($query || ($.mobile.browser.ie && $(this).width() >= 480)) 
          && $.mobile.ajaxEnabled;

然後，無論大小可能，任何手機都可以使用spliview。

來源

2012-10-18 04:28:17 nilabh

JQuery Mobile Phone gap：使用asyraf9示例不起作用的分割視圖

回答

相關問題