最佳方法:
结合下面的方法混合使用
在
IE
和Firefox
上使用Ajax轮询检查网络是否断了,其他浏览器上使用online
和offline
事件 侦听网络。
引用
html
<head> <script type="text/javascript" src="online.js"></script> </head>
设置轮询时间和地址
time: 时间不设置默认2000
url:不设置默认所有浏览器用online
和offline
事件
js
var net = onlinenetwork({ "time":1000, "url":"http://*******.com/ping.php" })
连上网络执行
js
net.onLineHandler(function(){ console.log("连上了!") })
断开网络执行
js
net.offLineHandler(function(){ console.log("断开网络!") })
一般判断方法:
方法一:利用online和offline事件
此方法是通过
online
和offline
事件来侦听是否断网,但是这个在IE
和Firefox
中,并非断网了就是真的断网了。(如火狐中在选择菜单>>文件>>脱机工作
才会触发online
和offline
事件)
总之在IE
和Firefox
中一般情况下不能触发这俩事件,只有在选择脱机状态下才能触发此事件。
js
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); });
方法二:Ajax轮询
你懂的
js
setInterval(function(){ //Ajax... },1000)
方法三:利用IMG的onerror事件
通过轮询生成
IMG
通过img
的onerror
事件判断是否断网
此方法弱点就是耗流量(一像素的空gif 轮询一次1.43KB
)手机上用那就蛋疼了(这个样子就会偷偷跑流量...)。
js
setInterval(function(){ var $img = $('<img src="http://jslite.io/blank.gif?'+(new Date())+'">') $img.appendTo('body').css("display","none").load(function(){ console.log("连接成功!") $(this).remove() }).error(function(){ console.log("断网了!") $(this).remove() }) },2000)
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。