online 和 offline 是设备在连接到互联网和断开互联网的时候发生的事件 …. 下面我们来看一下这两个事件的使用。
在应用的 index.js 文件里,可以添加这两个事件的监听器 … 可以把它们放在 deviceready 发生以后要做的事情里面,这样做会更安全一些。
可以复制前面视频里添加的这个事件的监听器 …
// 添加 online 事件的监听器
document.addEventListener('online', app.onOnline, false);
添加下注释 … 要监听的事件的类型 … 我们先看一下 online 这个事件 … 再添加一下事件发生以后,要做的事情 … 改成 onOnline … 这个名字你可以随便定义 …
然后再去定义这个 onOnline …
// 当发生 online 事件以后要做的事
onOnline: function(){
console.log('已经连接到互联网');
},
用类似的方法,我们再去添加一个 offline 事件的监听器,当断开互联网时触发的事件。
// 添加 offline 事件的监听器
document.addEventListener('offline', app.onOffline, false);
// 当发生 offline 事件以后要做的事
onOffline: function() {
console.log('掉线了!');
},
修改好以后,保存一下文件。
安装 Connection 插件
要想让这个 online 与 offline 事件能够正常的工作,我们还需要去安装一个 Connection 插件,这两个事件,需要用到 Connection 插件里提供的一些信息。
打开终端工具,进入到应用项目的目录里面 … 然后使用 phonegap local plugin add 命令去添加这个插件 …
phonegap local plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-network-informati...
安装好以后,再使用 phonegap run ios … 重新编译并安装一下修改之后的应用 …
测试
打开 weinre 的调试界面 … 选择 console 这个选项卡 … 因为我们现在用的是设备的模拟器,所以只要断开电脑的互联网连接,这个模拟器也会断开互联网连接。
这样就会触发 offline 这个事件 …
你会看到,在控制台上,会显示 掉线了! …
再连接到互联网 …. 控制台上会显示 已经连接到互联网 …