2015-12-19 61 views
0

我是新来的电话差距,并建立一个命令行界面(CLI)的Android应用程序,但当功能加载提醒我,如果手机在线或脱机失败。以下是我如何安装模块的代码和细节。PhoneGap在线和离线模式

我的问题是我得到的最后一个警报是“OK58”,那么手机只是继续加载和加载。

Javascript代码

功能onDeviceReady() {

"use strict"; 
alert("ok55"); 
document.addEventListener("online", onOnline, false); 
document.addEventListener("offline", onOffline, false); 

alert("ok58"); 


//try{ 
    var networkState = navigator.connection && navigator.connection.type; 

//的setTimeout(函数(){ = networkState navigator.connection & & navigator.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]); 
    //}, 500); 
    // }catch(e){ 
    // alert(e); 
// $.each(navigator, function(key, value){ 
    //  alert(key+' => '+value); 
// }); 
// } 

alert("hello"); 

我的html标题。上面的代码包含在common.js

<head> 
    <meta charset="utf-8" /> 
    <meta name="format-detection" content="telephone=no" /> 
    <meta name="msapplication-tap-highlight" content="no" /> 
    <meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline'; media-src *"> 
    <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 --> 
    <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" /> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
    <title>Eurotech</title> 
    <link rel="stylesheet" href="css/style_signiture.css"/> 
    <link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css"/> 
    <script src="cordova.js" type="text/javascript"></script> 
    <script src="js/phonegap-nfc-0.3.0.js"></script> 
    <script src="js/nfc.js"></script> 
    <script src="js/common.js"></script>  
    <script src="js/jquery-1.7.1.min.js"></script> 
    <script src="js/jquery.ajaxmanager.js"></script> 
    <script src="js/jqm.page.params.js"></script> 
    <script src="js/jquery.mobile-1.1.0.min.js"></script> 
    <script src="js/task.js"></script> 

    <script src="js/modernizr.custom.34982.js"></script> 
    <script src="js/application.js"></script> 
    <script src="js/signatureCapture.js"></script> 
    <script type="text/javascript" src="cordova.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> 
</head> 

在我的config.xml文件中,我有以下内容包含

<plugin name="cordova-plugin-whitelist" version="1" /> 
<plugin name="org.apache.cordova.network-information" spec="0.2.15" source="pgb" /> 
<plugin name="NfcPlugin" value="com.chariotsolutions.nfc.plugin.NfcPlugin"/> 

而且

<gap:plugin name="cordova-plugin-dialogs" source="npm" /> 
<gap:plugin name="org.apache.cordova.network-information" version="0.2.15" /> 

我通过使用

phonegap plugin add org.apache.cordova.dialogs 
phonegap plugin add cordova-plugin-network-information 

我的命令行安装的插件想想那就是一切。我怎样才能更好地调试?任何想法什么是错的?

回答

2

你有一些错字在你的代码,这应该工作(未经测试):

var networkState = navigator.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]); 

所有设备的要求是事件驱动,所以把它们放在超时是没有意义的。

请阅读文档https://www.npmjs.com/package/cordova-plugin-network-information

对于调试安装https://www.npmjs.com/package/cordova-plugin-console,那么你可以在SDK和/或浏览器开发者信息中看到输出。使用适用于iOS的Safari和适用于Android的Chrome。

如果你有一个旧的Android也可以使用weinre进行调试:https://people.apache.org/~pmuellr/weinre-docs/latest/

更新:

在这里,你有一个工作的例子,在iPad上测试9.2。

var app = { 
    initialize: function() { 

     document.addEventListener("deviceready", app.onDeviceReady, false); 
     document.addEventListener("online", app.onOnline, false); 
     document.addEventListener("offline", app.onOffline, false); 

    }, onDeviceReady: function() { 

     alert("App is started"); 

     app.getNetworkState(); 

    }, getNetworkState: function() { 

     var networkState = navigator.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]); 

    }, onOnline: function(){ 

     alert("Device is online"); 

     app.getNetworkState(); 

    }, onOffline: function(){ 

     alert("Device is offline"); 

    } 
}; 

app.initialize(); 

如果这不起作用,那么您的cordova/plugin安装有问题。祝你好运。 ;-))

+0

您的更改确实使屏幕停止变白,但我从来没有得到但仍然让页面继续加载。我将尝试您的调试技巧。谢谢 –

+0

你的代码中有两个事件监听器:在线和离线。您的代码中的onOnline和onOffline函数是否?否则,你会得到一个错误。你应该把事件监听器放在设备就绪事件之外。 – Joerg

+0

var networkState = navigator.connection.type;它不会超过这一点。我认为插件没有正确配置? –