多语言展示
当前在线:193今日阅读:91今日分享:37

JavaScript判断是否网络断了

结合下面的方法混合使用在IE和Firefox上使用Ajax轮询检查网络是否断了,其他浏览器上使用  online  和 offline 事件 侦听网络。
工具/原料

一台电脑 js编辑器

方法/步骤
1

引用侦听是否连上网络window.onLineHandler = function(){    console.log('连上了!')};侦听是否断开网络window.offLineHandler = function(){    console.log('断开网络!')};

2

法一:利用online和offline事件此方法是通过 online 和 offline 事件来侦听是否断网,但是这个在 IE 和 Firefox 中,并非断网了就是真的断网了。(如火狐中在选择 菜单>>文件>>脱机工作才会触发 online 和 offline 事件)总之在IE和Firefox中一般情况下不能触发这俩事件,只有在选择脱机状态下才能触发此事件。window.addEventListener('load', function() {    var status = document.getElementById('status');    function updateOnlineStatus(event) {        var condition = navigator.onLine ? 'online' : 'offline';        status.className = condition;        status.innerHTML = condition.toUpperCase();    }    window.addEventListener('online',  updateOnlineStatus);    window.addEventListener('offline', updateOnlineStatus);});

3

方法二:Ajax轮询你懂的setInterval(function(){    //Ajax...},1000)

4

方法三:利用IMG的onerror事件通过轮询生成 IMG 通过 img 的 onerror 事件判断是否断网此方法弱点就是耗流量(一像素的空gif 轮询一次 1.43KB )手机上用那就蛋疼了(这个样子就会偷偷跑流量…)。setInterval(function(){    var $img = $('')    $img.appendTo('body').css('display','none').load(function(){        console.log('连接成功!')        $(this).remove()    }).error(function(){        console.log('断网了!')        $(this).remove()    })},2000)

推荐信息