Phonegap在安卓模拟器中无法运行。

6
我按照基本的Phonegap教程(Eclipse,Android SDK,ADT Phonegap)的所有步骤进行操作,我在assets/www文件夹中创建了一个HTML页面,运行它后,显示了我的“Hello World HTML”。
第二步:我在HTML页面中添加了一个来自CDN的jQuery Mobile引用:它起作用了。
第三步:我创建了一个新的HTML页面,复制粘贴了下面的代码,这是从Phonegap网站上获取的示例,但它什么都没有做。甚至没有警报(我添加了一些警报以查看是否发生了某些事情,但即使onDeviceReady事件也不会触发)。
我已经放置了Phonegap JAR,将cordova-1.7.0.js放在我的assest/www目录中,但可能还缺少一些内容。
有人可以帮我吗?
我还尝试了Phonegap网站上的另一个示例(设备属性示例),但它仍然不起作用。
这是一个全新的Eclipse安装程序,我将Android版本设置为2.3.3,并使用Phonegap 1.7.0。
================
编辑
我多试了一些,现在可以重现错误,但不知道为什么会出现这种情况。
因此,我使用了Phonegap示例项目创建了一个新项目,它可以工作。
所以,我将该项目的所有资源(1个HTML、2个JS和1个CSS)复制到我的项目中,让应用程序从该HTML(从我的Activity类)开始启动,它可以工作。
现在是有趣的部分(不是):我将起始页重置为我的“旧”index.html(其中包含jQuery Mobile),然后单击链接到示例html,它不起作用。
因此,示例HTML作为启动项:它可以工作,通过链接打开示例HTML:不起作用。
而当我加载我的其他HTML页面时,它们也可以工作,而不是从起始页打开它们。
那么,我的jQuery Mobile驱动的主页是否会引起麻烦?(我将在下面复制粘贴代码)。
编辑2:当我使用非jQuery Mobile索引页面,并使用普通的链接链接到示例HTML时,它也可以工作。因此,这更多地提示我认为jQuery mobile阻碍了我的路……
链接代码如下:
<li><a href="index4.html" data-transition="none">phonegap example</a></li>

jQuery Mobile首页:
<html>
<head>
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
    <link rel="stylesheet" href="http://www.verfrisser.net/kalender/mobile/verfrisser.css" />
    <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>
</head>
<body>
  <div data-role="page">

    <div data-role="header">
        <h1>De NerdNight kalender</h1>
        <a href="about.html" data-rel="dialog">About</a><a href="genereren.html" data-transition="pop">Genereren</a>
    </div><!-- /header -->

    <div data-role="content">
        <img id="verfrisserlogo" src="verfrisserlogo.png" />
        <ul data-role="listview" data-inset="true" data-filter="false">
            <li><a href="2011.html" data-transition="none">2011</a></li>
            <li><a href="2012.html" data-transition="none">2012</a></li>
            <li><a href="2013.html" data-transition="none">2013</a></li>
            <li><a href="testing.html" data-transition="none">testing</a></li>
            <li><a href="testing2.html" data-transition="none">testing2</a></li>
            <li><a href="testing3.html" data-transition="none">testing3</a></li>
            <li><a href="index4.html" data-transition="none">phonegap example</a></li>
        </ul>
    </div><!-- /content -->

    <div data-role="footer">
        <h6>(C) Verfrisser 1998 till now</h6>
    </div><!-- /footer -->
</div><!-- /page -->
</body>
</html>

================

示例HTML(仅在页面中显示文本“A dialog box will report the network state”)

<!DOCTYPE html>
<html>  
<head>    
    <title>navigator.network.connection.type Example</title>    
    <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script> 
 <script type="text/javascript" charset="utf-8">    
   // Wait for Cordova to load    //    
   document.addEventListener("deviceready", onDeviceReady, false);  
   // Cordova is loaded and it is now safe to make calls Cordova methods   
    alert ('stand alone');
   //    
   function onDeviceReady() {
    alert ('onDeviceReady'); 
   checkConnection();   
   }    
   function checkConnection() {        
   var networkState = navigator.network.connection.type;        
   var states = {};       
   states[Connection.UNKNOWN]  = 'Unknown connection';        
   states[Connection.ETHERNET] = 'Ethernet connection';        
   states[Connection.WIFI]     = 'WiFi connection';       
   states[Connection.CELL_2G]  = 'Cell 2G connection';   
   states[Connection.CELL_3G]  = 'Cell 3G connection';   
   states[Connection.CELL_4G]  = 'Cell 4G connection';   
   states[Connection.NONE]     = 'No network connection';
   alert('Connection type: ' + states[networkState]); 
   }  

</script> 
</head>  
<body>
    <p>A dialog box will report the network state.</p>  
</body>
</html>

你添加了Android权限吗?你在res中添加了cordova.xml和plugins.xml吗? - coderslay
1
好的,我会尝试一下。 - Michel
我已经检查了,在我的\phonegap.helloworld\res\xml文件夹中有这两个文件... - Michel
我找到了问题,至少我认为是。我已经编辑了这个问题。您能看一下吗? - Michel
1
尝试使用此代码 <li><a href="testing2.html" data-transition="none" rel="external">testing2</a></li>,当我移动到 testing2.html 时,它会运行所有警报。 - dhaval
显示剩余8条评论
3个回答

9

默认情况下,下一页将作为DOM元素加载,因此JavaScript deviceready 将不会再次被调用。

尝试以下其中一种方式以正常方式运行它:

<li><a href="testing2.html" data-transition="none" rel="external">testing2</a></li>

或者

<li><a href="testing2.html" data-transition="none" data-ajax="false">testing2</a></li>

解释:

当点击链接时,jQuery移动将确保链接是引用本地URL,如果是,则阻止链接的默认点击行为,并通过Ajax请求引用的url。当页面成功返回时,它会将location.hash设置为新页面的相对URL。

如果Ajax请求成功,则将新页面内容添加到DOM中,所有移动小部件都将自动初始化,然后使用页面转换将新页面动画显示。

有关详细信息,请查看文档


1
你太棒了!我已经为这个问题奋斗了至少一个星期,每天30分钟,尝试了各种方法,每次都很失望。当我找到这个答案时,你可以想象我脸上的微笑! - Michel

1

只要你的代码没有错误,这个代码结构就不太好。你在第一页的头部提到了phonegap和jquery mobile javascript,但在第二页中没有。它在头部没有任何jquery mobile javascript文件。

根据我的知识:

  • 你可以从一个jquery mobile页面转换到另一个jquery mobile包含的页面。
  • 在两个头部都包含标准库文件。

这样就可以完成你的工作。


尝试过了,现在两个文件都引用了cordova.js、jquery mobile和jquery normal,但仍然没有运气。 - Michel

0

一旦您添加了@Coder_sLaY提到的xml文件,您需要将加载jQuery Mobile JS文件的服务器(CDN URL)添加到cordova.xml中允许的服务器白名单中。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接