1

PhoneGap と JQuery モバイルを使用して基本的な例を設定しようとしています。ブラウザでページを正しく読み込めません。問題は、ページが通常の html のようにレンダリングされることです。

私が参考にした情報
源 .. 0/docs/about/getting-started.html http://jquerymobile.com/demos/1.2.0/docs/pages/phonegap.html

次のようになります: http://jquerymobile.com/demos/1.2.0/docs/pages/page-template.html

私が得ているもの：
ここに画像の説明を入力

私のフォルダ構造：

/assets/  
-/www/  
--/cordova-2.4.0.js  
--/index.html  
--/jquery-1.8.2.js  
--/jquery.mobile-1.2.0.css  
--/jquery.mobile-1.2.0.js

これが私の基本的なhtmlページです：

<!DOCTYPE HTML>
<html>
    <head>
        <title>PhoneGap</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script type="text/javascript" charset="utf-8" src="cordova-2.4.0.js"></script>
        <link rel="stylesheet" type="type/css" href="jquery.mobile-1.2.0.css"/>
        <script src="jquery-1.8.2.js"></script>
        <script src="jquery.mobile-1.2.0.js"></script>
    <body> 

        <div data-role="page">

            <div data-role="header">
                <h1>Single page</h1>
            </div><!-- /header -->

            <div data-role="content">   
                <p>This is a single page boilerplate template that you can copy to build your first jQuery Mobile page. Each link or form from here will pull a new page in via Ajax to support the animated page transitions.</p>      
                <p>Just view the source and copy the code to get started. All the CSS and JS is linked to the jQuery CDN versions so this is super easy to set up. Remember to include a meta viewport tag in the head to set the zoom level.</p>
                <p>This template is standard HTML document with a single "page" container inside, unlike a <a href="multipage-template.html" data-ajax="false">multi-page template</a> that has multiple pages within it. We strongly recommend building your site or app as a series of separate pages like this because it's cleaner, more lightweight and works better without JavaScript.</p>
            </div><!-- /content -->

            <button>text</button>

            <div data-role="footer">
                <h4>Footer content</h4>
            </div><!-- /footer -->

        </div><!-- /page -->

    </body>
</html>

編集：これが私のlogcatにあるものです.. 

02-20 11:31:47.342: E/Web Console(18138): Uncaught SyntaxError: Unexpected token ; at file:///android_asset/www/jquery.mobile-1.2.0.js:2655

これは、私の www フォルダーを含む Google ドライブへのリンクです...
https://docs.google.com/folder/d/0B3ALaz5FfLwgZUJjdW1PTnJyblE/edit?usp=sharing

4

1 に答える 1

2

あなたの問題はjquery-1.9.1.jsにあり、jQuery Mobile 1.2 はバージョン 1.8.3 より上の jQuery では動作しません。

この jSFiddle の例でテストすることもできます: http://jsfiddle.net/Gajotres/yWTG2/、左上隅の jQuery バージョンを変更するだけです。1.9.1 に変更します。そしてすべてがブレーキをかけます。

したがって、これを変更します。

<script src="jquery-1.9.1.js"></script>

バージョン 1.8.3 に。

編集 ：

あなたのソースをダウンロードしました。あなたの jQuery Mobile css と js ソースに問題があることがわかりました。私の jsFiddle の例からそれらを再ダウンロードしてください。その後、すべてが正しく機能します。

于 2013-02-20T17:37:30.330 に答える