2

JQuery mobile（1.2.0）をPhonegap（2.2.0）でXcodeと連携させることを初めて試みています。Xcode/Phonegapのインストールは機能します-それはに従ってセットアップされています

https://web.archive.org/web/20200806105755/http://docs.phonegap.com/en/2.2.0/guide_getting-started_ios_index.md.html

次に、このプロジェクトのwww / js ad www/cssにjquerymobilecssとjsを追加し、単純なindex.htmlを取得しました。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta name="format-detection" content="telephone=no" />
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
        <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.2.0.css"/>
        <link rel="stylesheet" type="text/css" href="css/jquery.mobile.structure-1.2.0.css"/>

        <title>Test of jquery mobile</title>
    </head>
    <script type="text/javascript" src="cordova-2.2.0.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript" src="js/jquery.mobile-1.2.0.js"></script>
    <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
 

       <body>
            <div data-role="page" id="liveListPage">
                <div data-role="header" data-position="fixed" data-theme="a" >
                    <h1>Header</h1>
                </div>
                
                <div data-role="footer"  data-position="fixed" data-theme="a"  >
                    <h1>Footer</h1>
                </div>
            </div>
               
            
        </body>
    </html>

しかし、Runを押すと（正常にビルドされますが、jquery mobileはまったく動作していないようです）、位置とテーマが固定されていないh1「Header」と「Footer」が表示されます。私のスキームは<MyApp>/ iPhone6.0Simulatorです。

私は何が間違っているのですか？ログウィンドウにエラーはありません。

4

3 に答える 3

0

ここにはいくつかの可能性があります。

  • ビルドは実際には最新ではありません-xcodeは常にWebファイルへの変更を検出するとは限らないため、デバイスで実行すると古いバージョンが表示されます。クリーンは通常これを修正します。

  • リンクが少し間違っています。デスクトップOSとは異なり、iOSでは大文字と小文字が区別されるため、通常は大文字と小文字が区別されます。サファリWebインスペクターをアプリに接続すると、ロードされなかったファイルを確認できます。

  • リンクは完全に間違っています-デスクトップブラウザで開いたときにHTMLは機能しますか？

于 2012-11-16T01:57:25.343 に答える
0

これが問題であるかどうかはよくわかりませんが、スクリプトが頭でも体でもないことに気づきました。どちらか一方にあるはずなので、常に頭の中でスクリプトを作成します。だからこれは私がやろうとしていることです

   <!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <meta name="format-detection" content="telephone=no" />
            <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
            <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.2.0.css"/>
            <link rel="stylesheet" type="text/css" href="css/jquery.mobile.structure-1.2.0.css"/>

            <title>Test of jquery mobile</title>

            <script type="text/javascript" src="cordova-2.2.0.js"></script>               
           <script type="text/javascript" src="js/jquery.mobile-1.2.0.js"></script>
           <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
           <script type="text/javascript" src="js/index.js"></script> <!--your script-->


        </head>
           <body>
                <div data-role="page" id="liveListPage">
                    <div data-role="header" data-position="fixed" data-theme="a" >
                        <h1>Header</h1>
                    </div>

                    <div data-role="footer"  data-position="fixed" data-theme="a"  >
                        <h1>Footer</h1>
                    </div>
                </div>


            </body>
        </html>

編集::index.js誰かがあなたのスクリプトファイルがjQueryファイルの上にあるのでjQueryライブラリを登録しないので、ファイルを少し下に移動してjqueryライブラリファイルの下にあることを指摘した後も気づきました

于 2012-11-15T22:41:53.517 に答える
0

スクリプト ファイルの順序を変更します。また、jqm で css ファイルをロードしていないことに気付きました。したがって、最初に jquery Web サイトからロードして試すことができます。js ファイルと css ファイルをロードする順序は非常に重要です。

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.2.0.js"></script>
<script type="text/javascript" src="cordova-2.2.0.js"></script>
<script type="text/javascript" src="js/index.js"></script>
于 2012-11-16T06:02:39.967 に答える