PhoneGap中文网

标题: phonegap 安卓应用 online监听 [打印本页]

作者: makai091031 时间: 2015-6-29 19:23
标题: phonegap 安卓应用 online监听
在安卓程序上监听online事件，手机测试，没反应，用的是cordova-2.9.0。希望知道的大神解答一下

作者: admin 时间: 2015-6-29 21:01
代码放出来瞅瞅，官方文档代码复制过来就可以用的，先看看deviceReady 事件执行了没有执行了以后然后在监听online 事件

function onDeviceReady() {
document.addEventListener("offline", onOffline, false);
document.addEventListener("online", onOnline, false);
}
function onOffline(e) {
// Handle the offline event
alert("网络连接未连接");
}
function onOnline() {
// Handle the offline event
alert("网络连接已连接");
}

复制代码

作者: makai091031 时间: 2015-6-29 21:40

admin 发表于 2015-6-29 21:01
代码放出来瞅瞅，官方文档代码复制过来就可以用的，先看看deviceReady 事件执行了没有执行了以后然后在监 ...

代码就跟你贴的这个一样，不知道哪里问题

作者: makai091031 时间: 2015-6-29 21:42

admin 发表于 2015-6-29 21:01
代码放出来瞅瞅，官方文档代码复制过来就可以用的，先看看deviceReady 事件执行了没有执行了以后然后在监 ...

!DOCTYPE HTML> <html>
<head>
<title>Example 14-1</title>
<meta http-equiv="Content-type" content="text/html;charset=utf-8">
<meta name="viewport" id="viewport" content="width=device-width,height=device-height,initial-scale=1,maximum-scale=1,user-scalable=no;" />
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery.js"></script>

<script type="text/javascript" charset="utf-8">

//build an accessible representation of the different
//network state values
var states={};
states[Connection.UNKNOWN]='Unknown';
states[Connection.ETHERNET]='Ethernet';
states[Connection.WIFI]='Wi-Fi';
states[Connection.CELL_2G]='Cell 2G';
states[Connection.CELL_3G]='Cell 3G';
states[Connection.CELL_4G]='Cell 4G';
states[Connection.NONE]='No network';

function onBodyLoad(){
document.addEventListener("deviceready",onDeviceReady,false);
}

function onDeviceReady(){
navigator.notification.alert("PhoneGap is ready!");
//Add the online event listener
document.addEventListener("online",isOnline,false);
//Add the offline event listener
document.addEventListener("offline",isOffline,false);

}

function isOnline(){
var d=new Date();
navigator.notification.alert("hello is ready!");
$('#networkInfo').prepend("Online("+getConnectionTypeStr()+")<br />");
}

function isOffline(){
var d=new Date();
$('#networkInfo').prepend("Offline<br />");
}

function getConnectionTypeStr(){
//get the network state
var networkState=navigator.network.connection.type;
navigator.notification.alert("world is ready!");
//return a string representing the current network state
return states[networkState];
}
</script>
</head>
<body onload="onBodyLoad()">
<h1>Example 14-1</h1>
<p id="networkInfo"></p>
</body>

</html>

作者: makai091031 时间: 2015-6-29 21:46

makai091031 发表于 2015-6-29 21:42
!DOCTYPE HTML>

Example 14-1

isonline函数没有执行，这个是什么原因呢

作者: makai091031 时间: 2015-6-30 19:22
此问题已经解决，貌似只要监听deviceready就可以，在应用代码中直接获得网络类型即可，不需要按那些教材上写的什么监听online和offline事件。配置什么的按教材上写的就可以。附上代码和图，供遇到同样问题的人作参考。
代码：
<!DOCTYPE HTML> <html>
<head>
<title>Example 14-1</title>
<meta http-equiv="Content-type" content="text/html;charset=gb2312">
<meta name="viewport" id="viewport" content="width=device-width,height=device-height,initial-scale=1,maximum-scale=1,user-scalable=no;" />
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery.js"></script>

<script type="text/javascript" >

//build an accessible representation of the different
//network state values
function onBodyLoad(){
document.addEventListener("deviceready",onDeviceReady,false);
}

function onDeviceReady(){
$('#networkInfo').prepend("网络类型：("+getConnectionTypeStr()+")<br />");
if(getConnectionTypeStr()=="wifi"||getConnectionTypeStr()=="2g"||getConnectionTypeStr()=="3g"||getConnectionTypeStr()=="4g"){
$('#word').prepend("网络连接成功");
}else{
$('#word').prepend("网络未连接");
}

}

function getConnectionTypeStr(){
//get the network state
var networkState=navigator.network.connection.type;
//return a string representing the current network state
return networkState;
}
</script>
</head>
<body onload="onBodyLoad()">
<h1>网络类型测试</h1>
<p id="word"></p>
<p id="networkInfo"></p>

</body>

</html>
截图：

作者: makai091031 时间: 2015-6-30 19:29
上述代码运行结果图

image002.jpg (20.98 KB, 下载次数: 581)

运行后图片

作者: admin 时间: 2015-6-30 23:22

makai091031 发表于 2015-6-30 19:29
上述代码运行结果图

恭喜恭喜

欢迎光临 PhoneGap中文网 (http://bbs.phonegap100.com/)