0

iPhone と Android 用のjQuery Mobile と Java スクリプトを使用して Phone Gap アプリケーションを実装しました。

私のアプリはほぼ完成しています。

これまで、すべてのページに単一の index.html ファイルを使用していました。

今、私は使用する必要がありますdifferent html files for different pages.

そのため、さまざまなページ用に複数の外部 html ファイルを作成し、参照をリンクして、それらを www フォルダーに追加しました。

私はそのcssが表示されないリストビューを持っているという点で

ここに画像の説明を入力

メインページ:- index.htmlファイルの参照page2とpage3参照

<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>
4

2 に答える 2

1

コードを間違って読んでいる可能性がありますが、jqueryモバイルスタイルシートへのリンクがコメント化されているようです。スタイルを適用するには、HTMLでそれらを定義する必要があります。

投稿したコードからは明らかではない他の場所にそれらをロードしていますか？

于 2012-07-25T16:02:17.213 に答える
0

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-27T20:53:13.237 に答える