1

我正在尝试使用 PhoneGap 和 JQuery mobile 设置一个基本示例。我无法让页面在我的浏览器中正确加载。问题是页面只是像普通的 html 一样呈现。

我咨询过的来源..
http://docs.phonegap.com/en/2.4.0/guide_getting-started_android_index.md.html#Getting%20Started%20with%20Android_2_install_sdk_cordova http://jquerymobile.com/demos/1.2。 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 文件夹......
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 回答