PhoneGap jQuery手机多个html文件css不工作

我已经实施了一个手机差距应用程序使用jQuery Mobile和Java脚本 iPhone和机器人。PhoneGap jQuery手机多个html文件css不工作

我的应用程序已接近完成。

直到现在我用单index.html文件的所有页。

现在我需要使用different html files for different pages.

所以我已经创建了不同的页面多个外部HTML文件，链接引用和到www文件夹中添加他们。

，该

我有一个列表中查看它的CSS不visable

enter image description here

主页： -见page2和page3裁判在的index.html文件

<div data-role="content"> 
    <ul data-role="listview" data-theme="e" data-header-theme="a" data-dividertheme="a" id="List view"> 
     <li data-role='list-divider' ><big>Lis view</big></li> 
     <li><a href='#page1' id='Page1' data-panel='main'>Page1 Information</a></li> 
     <li><a href='page2.html' rel="external" id='pagetwoid' data-panel='main'>Go to Page 2</a></li> 
     <li><a href='page3.html' rel="external" id='pagethreeid' data-panel='main'>Go to Page 3</a></li>        </ul> 
</div>

第2页： -

<!DOCTYPE html> 
<html> 
    <head> 
      <title>Multiple htmls</title> 

      <meta id="viewport" name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" /> 

      <!-- 
      <link rel="stylesheet" href="inc/jquery.mobile-1.0.1.min.css" /> 
      <link rel="stylesheet" href="inc/jquery.mobile.splitview.css" /> 
      <link rel="stylesheet" href="inc/jquery.mobile.grids.collapsible.css" /> 
      <link rel="stylesheet" href="inc/jquery.mobile.structure-1.0.1.min.css" /> 
      --> 
      <link rel="stylesheet" href="inc/jquery.alerts.css" /> 
      <link rel="stylesheet" href="inc/jquery.mobile.datebox.css" /> 
      <script charset="utf-8" src="cordova-1.9.0.js"></script> 
      <script type="text/javascript" src="inc/jquery-1.7.1.js"></script> 
      <script type="text/javascript" src="inc/jquery.mobile.splitview.js"></script> 


      <script type="text/javascript" src="inc/jquery.mobile-1.0.1.min.js"></script> 
      <script type="text/javascript" src="inc/jquery.alerts.js"></script> 
      <script type="text/javascript" src="inc/iscroll-wrapper.js"></script> 

      <script type="text/javascript" src="inc/iscroll-lite.js"></script> 

      <script type="text/javascript"> 
          alert('js Loadfed'); 
       </script> 

      <style> 
       alert(); 
       alert('css loaded'); 

       </style> 

    </head> 

    <body> 


      <!--============= Page2 ===============---> 
      <div data-role="page" id="siteContacts" data-theme="e" > 
       <div data-role="header"> 
        <h1>Page 2 </h1> 
        <a href="page2.html" id="EditButton" data-role="button" data-icon="gear" class="ui-btn-right" data-theme="e" >Edit</a> 
       </div> 

        <div data-role="content"> 
         <ul data-role="listview" data-inset="true" class="ui-listview" data-dividertheme="a"> 

           <li data-role="list-divider"> <!--list Header ---> 
            <div class="ui-grid-c"> <!--Section Headers Grid---> 
             <div class="ui-block-a" ><big> aaaa</big> </div> 
             <div class="ui-block-b" ><big> bbbb</big> </div> 
             <div class="ui-block-c" ><big> ccc</big> </div> 
             <div class="ui-block-d" ><big> e-sss</big> </div> 
            </div> 

           </li> 
           </ul> 
         </div> 




    </body> 
    </html>

来源

2012-07-25 user1425472

也许我读你的代码错误，但它看起来像链接到jQuery Mobile的样式表被注释掉。您一定需要在HTML中定义它们以获取应用的样式。

您是否将它们加载到其他地方，它从您发布的代码中看不到它？

来源

2012-07-25 16:02:17 user1452076

PhoneGap要求您在根目录的“config.xml”文件中手动设置/允许应用程序的各个方面。

你正在寻找，我相信该解决方案，是这一行：

<access origin="http://code.jquery.com" subdomains="true" />

您允许访问的“http://code.jquery.com”的外部资源，并允许其所有子域。这意味着，你刚才已解锁jQuery Mobile的，这是你要的是什么，因为看到你的脚本标签：

<script type="text/javascript" src="inc/jquery-1.7.1.js"></script> 
<script type="text/javascript" src="inc/jquery.mobile.splitview.js"></script> 
这些“SRC”属性现在被视为http://code.jquery.com“子域”，这你刚刚成功允许！

来源

2013-06-27 20:53:13 theHopper

PhoneGap jQuery手机多个html文件css不工作

回答

相关问题