1、通过window.navigator.onLine来检测,用户当前的网络状况,返回一个布尔值, 但是不同浏览器会存在差异
2 、online 和 offline ,他们监听的对象都是window
online用户网络连接时被调用
offline用户网络断开时被调用
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>onLine</title><style>body {padding: 0;margin: 0;background-color: #F7F7F7;}p {width: 200px;height: 40px;text-align: center;line-height: 40px;margin: 100px auto;color: #FFF;font-size: 24px;background-color: #000;display: none;}</style></head><body><p class="tips"></p><script src="jquery.min.js"></script><script>// 通过 window.navigator.onLine 来检测网络是否可用// alert(window.navigator.onLine);// 当网络断开到时候 弹出 p 显示网络已断开 然后消失window.addEventListener('offline', function() {$(".tips").text("奥利个奥,网络断开了").fadeIn(500).delay(1000).fadeOut();})// 当网络连接到时候 弹出 p 显示网络连接 然后消失window.addEventListener('online', function() {$(".tips").text("网络已经连接").fadeIn(500).delay(1000).fadeOut();})</script></body></html>
如果觉得《监测网络连接状态》对你有帮助,请点赞、收藏,并留下你的观点哦!