javascript检测是否联网的实现代码
更新时间：2014年09月28日 17:13:51 投稿：mdxy-dxy
这篇文章主要介绍了javascript检测是否联网的实现代码,需要的朋友可以参考下
最简单粗暴的方式就是加载网络资源，JS文件或者图片文件。
复制代码 代码如下:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
typeof window.jQuery === "undefined" // return false or ture
用jQuery变量来检测是否联网
function doConnectFunction() {
return true;
}
function doNotConnectFunction() {
return false;
}
var i = new Image();
i.onload = doConnectFunction;
i.onerror = doNotConnectFunction;
i.src = 'http://su.bdimg.com/static/superplus/img/logo_white.png?d=' + escape(Date());
加载网络资源的问题就是检测的互联网，如果是局域网检测是无能为力了。
这时候需要一个更好的解决方案，就要用到navigator.onLine，这个属性比较坑的就是浏览器兼容，chrome、Safari 都完美支持，IE7以上是支持的。火狐和IE6比较坑，只有在浏览器“脱机状态”下才返回false，其他都返回true。掐了网线都是true，Opera直接不支持了。
所以还得加一个兼容方法：给location.hostname地址发一个http头请求，代码如下：
var xhr = new ( window.ActiveXObject || XMLHttpRequest )( "Microsoft.XMLHTTP" );
var status;
xhr.open( "HEAD", "//" + window.location.hostname + "/?rand=" + Math.floor((1 + Math.random()) * 0x10000), false );
try {
xhr.send();
return ( xhr.status >= 200 && xhr.status < 300 || xhr.status === 304 );
} catch (error) {
return false;
}
里面一个要注意的就是open方法的第三个参数要传false，必须是同步请求。
总结：支持navigator.onLine的浏览器就用navigator.onLine，不支持的就发一个http头请求。
原创文章，转载请注明： 转载自前端开发
相关文章
这篇文章主要为大家详细介绍了js html制作简单日历的方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
图片轮播效果，在各大网站的首页都能看到，比较常见，下面脚本之家小编给大家介绍Javascript实现图片轮播效果(一)让图片跳动起来，需要的朋友参考下2016-02-02
最近由于需要我们将相关id的重复的去掉，一个是客户端一个后台程序把关，这里分享下js的去重复id的实现代码2013-07-07
本文从7个方面讲述 JavaScript 中那些你不很熟知但非常实用的技巧。2010-04-04
在本篇文章中小编给各位整理的是关于js new Date()测试的相关实例代码，有需要的朋友们参考学习下。2019-10-10
addRule在firefox下的兼容写法...2006-11-11
这篇文章主要介绍了javascript实现获取图片大小及图片等比缩放的方法,涉及javascript针对图形图像相关属性获取与修改相关操作技巧,需要的朋友可以参考下2016-11-11
这篇文章主要介绍了js中如何精确计算加法和减法,需要的朋友可以参考下2014-03-03
IE有许多好用的方法，后来都被其他浏览器抄袭了，比如这个contains方法。如果A元素包含B元素，则返回true，否则false。唯一不支持这个方法的是IE的死对头firefox。2011-01-01
这篇文章主要介绍了浅谈javascript如何获取文件后缀名，文章通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-08-08
最新评论