Question

我正在使用jQuery Mobile和Phonegap（3.3）开发移动应用程序，在这个应用程序中我想在iframe中显示网站，所以我需要定期检查互联网连接，我还想要一个没有互联网连接的弹出窗口。在我的应用程序中有一个图像，我使用此图像作为菜单，一些图像链接连接到互联网所以我想每当点击这个图像它检查互联网连接，如果没有互联网连接弹出窗口出现。我试试这个：

<script type="text/javascript" charset="utf-8">
// Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);
function 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>

仅在应用程序启动时第一次检查。但我需要定期检查

我试试这个：

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

// Wait for PhoneGap to load
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}

// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {

} 
// alert dialog dismissed
function alertDismissed() {
// do something
}
function checkReachability() {
var _check=true;

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: '+ networkState + states[networkState]);
if(networkState==="unknown"){
_check=false;
showAlert();
return _check;
}
else {
return true;
}
}
function showAlert() {
navigator.notification.alert("Please connect your device to Internet.",onDeviceReady,"No Network        Connectivity","OK");
}
</script>
<img src="sample.png" id="img1" data-linkurl="#page2" onClick="checkReachability()">

我试试这个：

<script>
document.addEventListener("offline", function() {
alert("No internet connection");
}, false);
</script>

我试试这个：

 document.addEventListener("offline", onOffline, false);
 document.addEventListener("online", onOnline, false);
 function onOnline() {
 $.mobile.back();
}
//
function onOffline() {
$.mobile.changePage( "offline.html");
}

我也试试这个：

function onDeviceReady(){
try{
    var networkState = navigator.connection && navigator.connection.type;

    setTimeout(function(){
        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);
    });
   }
}

config.xml中：

<gap:config-file platform="android" parent="/manifest">
    <uses-permission name="android.permission.ACCESS_NETWORK_STATE" />
</gap:config-file>

<gap:config-file platform="android" parent="/manifest">
    <uses-permission name="android.permission.INTERNET" />
</gap:config-file>  

<gap:config-file platform="android" parent="/manifest">
    <uses-permission name="android.permission.READ_PHONE_STATE" />
</gap:config-file>

<plugin name="NetworkStatus" value="org.apache.cordova.NetworkManager" />
<plugin name="Geolocation" value="org.apache.cordova.GeoBroker"/>

androidmainfest.xml

 <uses-permission android:name="android.permission.INTERNET" />   
 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

guyz请帮帮我提前致谢。

Answer 1

由于您没有提及，请确保您已安装网络信息插件：https://github.com/apache/cordova-plugin-network-information/blob/master/doc/index.md

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

检查互联网连接并显示弹出窗口

1 个答案: