方法 一

navigator.onLine  

这个html5的 navigator的新特性可以很简单帮我们搞定
HTML5为此定义了一个navigator.onLine属性,这个属性值为true表示设备能上网,值为false表示设备离线。
当然不同的浏览器,对这个的支持还不太一样
IE6+和Safari 5+支持的比较好
Firefox 3+和支持navigator.onLine属性,但你必须手工选中菜单项“文件-Web开发人员(设置)-脱机工作”才能让浏览器正常的工作。
Chrome需要12以上。
if (navigator.onLine)
{ //正常工作}
else { //执行离线状态时的任务}
方法 二

online和offline。

当网络从离线变为在线或者从在线变为离线时,分别触发这两个事件。这两个事件在window对象上触发。(必须要手工轮询这个属性才能检测到网络状态的变化。 )

var EventUtil = {
addHandler: function (element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent("on" + type, handler);
} else {
element["on" + type] = handler;
}
}
};
EventUtil.addHandler(window, "online", function () {
alert("Online");
});
EventUtil.addHandler(window, "offline", function () {
alert("Offline");
});
方法 三

Offline.js 插件(https://github.com/hubspot/offline)

  

原文地址:https://www.jianshu.com/p/b1379ab332aa

  

js检测是够断网的更多相关文章

  1. JS 检测客户端断网情况

    常用方法 1 navigator.onLine 2 window.addEventListener() 3 获取网络资源 4 ajax请求 1. navigator.onLine 只会在机器未连上路由 ...

  2. h5 网络断网时,返回上一个页面 demo (与检测网络代码相结合,更直观看到结果)

    页面一: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8& ...

  3. 心跳机制tcp keepalive的讨论、应用及“断网”、"断电"检测的C代码实现(Windows环境下)

    版权声明:本文为博主原创文章,转载时请务必注明本文地址, 禁止用于任何商业用途, 否则会用法律维权. https://blog.csdn.net/stpeace/article/details/441 ...

  4. js img图片加载失败,重新加载+断网检查

    我们常常会遇到img加载图片的时候因为网络问题或者图片过大导致图片加载失败的问题,页面就因为这张蹦掉的图变得不美观.所以我们需要图片加载失败的时候重新加载图片,前端图片加载优化 //js方法定义 fu ...

  5. Delphi之TClientSocket和TServerSocket使用tcp keepalive心跳机制实现“断网”、"断电"检测

    开发环境:Delphi7 测试环境:WinXP,Win7  32bit,Win7 64bit 使用TClientSocket和TServerSocket实现TCP长连接通讯,经常因为断电断网等原因导致 ...

  6. 30分钟玩转Net MVC 基于WebUploader的大文件分片上传、断网续传、秒传(文末附带demo下载)

    现在的项目开发基本上都用到了上传文件功能,或图片,或文档,或视频.我们常用的常规上传已经能够满足当前要求了, 然而有时会出现如下问题: 文件过大(比如1G以上),超出服务端的请求大小限制: 请求时间过 ...

  7. websocket断网消息补发

    注册irealtime 首先去irealtime网站注册一个账号,然后创建一个应用,注册过程请参考获取开发者账号和 appkey 创建页面 <!DOCTYPE html> <html ...

  8. Python 实现断网自动重连

    为了实现 断网了,自动连接网络原理:每隔一段时间ping一下百度,判断网络状态,没有联网的话,就模仿浏览器发一条Post给服务器import urllibimport hashlibimport su ...

  9. 用图像识别玩Chrome断网小游戏

    先来看一下效果 正文 最近在学习机器学习方面的知识,想着做个东西玩玩,然后就接触到了TensorFlow这个机器学习框架,这个框架封装了机器学习的一些常用算法. 不过要自己实现一套流程还是比较麻烦,我 ...

随机推荐

  1. GitHub fork的使用

    我的GitHub账号是lanshanxiao,fork的账号是king1ko1king,再此说明! fork的项目是:Class-for-Everyone-Java-Server- 作者源项目地址是: ...

  2. Code Signal_练习题_reverseParentheses

    You have a string s that consists of English letters, punctuation marks, whitespace characters, and ...

  3. sqlserver年月日转汉字大写

    也是今天sql群里有人问,看起来这个问题挺简单,但是我不知道具体该怎么实现.百度了一把,找到一个高手贡献的答案,记一下. 参考链接 sql中转换中文日期 ------ 配合相关函数 ------ cr ...

  4. Dynamics 365Online 查询Web Api的请求WebUri

    在on-premises版本中,获取weburi的方式是进设置-自定义项-开发人员资源中查看地址,但online版本中的地址会有些许的差异 online的开发者资源中的地址如下图,如果你在页面java ...

  5. Android自定义View探索—生命周期

    Activity代码: public class FiveActivity extends AppCompatActivity { private MyView myView; @Override p ...

  6. eclipse maven构建的java web工程项目 在修改了工程项目名时,tomcat启动异常java.lang.IllegalArgumentException: Can't convert argument:null

    问题 我修改了前一个项目的名称.重新启动该项目至tomcat,报错:Java.lang.IllegalArgumentException: Can't convert argument: null 因 ...

  7. JQuery 引用方式

    # head里面 <script src="jquery.min.js"></script> <script src="common.js& ...

  8. Windows 安装mkvirtualenv虚拟python环境

    pip install virtualenvwrapper-win mkvirtualenv --python=python.exe 新python虚拟环境名称 使用方法 所有的命令可使用:virtu ...

  9. tomcat报错相关问题

    action1:tomcat7w.exe里面path to executable不是当前所用的tomcat(可执行文件路径是你以前使用过的tomcat路径,导致启动服务报错:找不到可执行文件) 解决办 ...

  10. null的专栏:https://blog.csdn.net/google19890102

    null的专栏:https://blog.csdn.net/google19890102 csdn博客专栏:https://blog.csdn.net/column.html