修改

Question

我按照基本的Phonegap教程（Eclipse，Android SDK，ADT Phonegap）中的所有步骤，在assets / www文件夹中创建了一个HMTL页面，运行它，并显示我的hello world html。

第2步：我在HTML页面的CDN上添加了对jQuery Mobile的引用：它有效。

第3步：我创建了一个新的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开始（从我的活动类开始），然后就可以了。

现在为了有趣的部分（不是）：我将startpage重置为我的'old'sindex.html（这是jQuery mobile），然后点击示例html的链接，它不起作用。

所以示例html作为启动：它工作，通过链接打开示例html：不起作用。

当我加载其他不起作为起始页面的html页面，而不是通过起始页面打开它们时，它们也起作用。

那么，我的jQuery Mobile支持的索引页面是否可能导致问题？（我将复制粘贴下面的代码。）

EDIT2：当我使用非jQuery Mobile索引页面并且我链接到示例html的正常<A href>链接时，它也有效。所以我越来越暗示我认为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对话框将在页面中报告网络状态'）

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

Answer 1

使用默认行为时，下一页将作为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 mobile将确保链接为   引用本地URL，如果是这样，它将阻止链接的默认值   单击发生的行为并通过Ajax请求引用的URL   代替。页面成功返回后，将设置   location.hash到新页面的相对URL。

如果Ajax请求成功，则将新页面内容添加到DOM，所有移动窗口小部件都会自动初始化，然后将新页面设置为带有页面转换的视图。

有关详细信息，请查看doc

Answer 2

您的代码中没有错误。上面的代码结构没有很好地构造。你在第一页的头部而不是第二页中提到了phonegap和jquery移动javascript。它的头部没有任何jquery移动javascript文件。

据我所知的事实：

您可以将Jquery从一个jquery移动页面转换到另一个 jquery mobile包含页面。
在两个标题中包含标准库文件。

这将完成你的工作。

Answer 3

添加@Coder_sLaY提到的xml文件后，需要将服务器从您加载jQuery Mobile JS文件（CDN URL）的位置添加到cordova.xml中允许的服务器的白名单

Phonegap无法在Android模拟器中运行

修改

3 个答案: