HTML5中对于网络是否断开的检测.很有意思哦
//事件的封装
var EventUtil = {
addHandler: function (element, type, handler) {//注册事件
if (element.addEventListener) {//非IE
element.addEventListener(type, handler, false);
}
else if (element.attachEvent) {//IE
element.attachEvent("on" + type, handler);
}
else {//dom0级
element["on" + type] = handler;
}
},
removeHandler: function (element, type, handler) {//取消注册事件
if (element.removeEventListener) {//非IE
element.removeEventListener(type, handler, false);
}
else if (element.detachEvent) {//IE
element.detachEvent("on" + type, handler);
}
else {//dom0级
element["on" + type] = null;
}
},
getEvent: function (event) {//返回event的引用
return event ? event : window.event;
},
getTarget: function (event) {//返回鼠标单击的目标对象
return event.target || event.srcElement;
},
preventDefault: function (event) {//取消默认事件(a的href,radio,checkbox,)
if (event.preventDefault) {
event.preventDefault();
}
else {
event.returnValue = false;
}
},
stopPropagation: function (event) {//因为这个EventUtil只支持冒泡,不支持事件捕获,所以这个方法只能阻止冒泡
if (event.stopPrapagation) {
event.stopPropagation();
}
else {
event.cancelBubble = true;
}
},
getRelatedTarget: function (event) {//获取相关元素
/*
页面中有一个div;当鼠标离开这个div时,事件的主目标是div,而相关元素是body.
mouseover:事件的主目标是获得光标的元素,而相关元素就是那个失去光标的元素.
mouseout:事件的主目标是失去光标的元素,而相关元素使获得光标的那个元素.
*/
if (event.relatedTarget) { return event.relatedTarget; }
else if (event.toElement) { return event.toElement; }
else if (event.fromElement) { return event.fromElement; }
else { return null; }
},
getButton: function (event) {//获取鼠标按钮的点击方式
if (document.implementation.hasFeature("MouseEvents", "2.0")) { return event.button; }
else {
switch (event.button) {
case 0:
case 1:
case 3:
case 5:
case 7:
return 0; //左击
case 2:
case 6:
return 2; //中间键
case 4:
return 1; //右击
}
}
}
}; //是否在线的判断:
window.onload = function () {
function addMessage(str) {
var oDiv = document.getElementById("line");
var oP = document.createElement("p");
oP.innerHTML = str;
oDiv.appendChild(oP);
}
EventUtil.addHandler(window, "online", function () {
addMessage("在线");
});
EventUtil.addHandler(window, "offline", function () {
addMessage("不在线");
});
}
<body>
在线检测;
<div id="line"></div>
</body>
测试环境:
结果:
HTML5中对于网络是否断开的检测.很有意思哦的更多相关文章
- 在c#中利用keep-alive处理socket网络异常断开的方法
本文摘自 http://www.z6688.com/info/57987-1.htm 最近我负责一个IM项目的开发,服务端和客户端采用TCP协议连接.服务端采用C#开发,客户端采用Delphi开发.在 ...
- 检测是否支持HTML5中的Video标签
//检测是否支持HTML5 function checkVideo() { if (!!document.createElement('video').canPlayType) { var vidTe ...
- 带你认识HTML5中的WebSocket
这篇文章主要介绍了带你认识HTML5中的WebSocket,本文讲解了HTML5 中的 WebSocket API 是个什么东东.HTML5 中的 WebSocket API 的用法.带Socket. ...
- HTML5中的服务器‘推送’技术 -Server-Sent Events
转帖:http://www.developersky.net/thread-63-1-1.html 一直以来,HTTP协议都是严格遵循Request-Response模型的.客户端发送一个Reques ...
- html5中的video标签和audio标签
不管是否承认,flash早已不像过往那样如日中天了.亚马逊全面放弃flash.苹果放弃flash.安卓也放弃了移动端的flash支持.事实上flash已经不太适合web开发了,因为HTML5中的vid ...
- HTML 5 应用程序缓存（Application Cache）cache manifest 文件使用 html5 中创建manifest缓存以及更新方法 一个manifest文件会创建一份缓存，不同的manifest文件其缓存的内容是互不干扰的
HTML5 离线缓存-manifest简介 HTML 5 应用程序缓存 使用 HTML5,通过创建 cache manifest 文件,可以轻松地创建 web 应用的离线版本. 什么是应用程序缓存(A ...
- HTML5 中 40 个最重要的技术点
介绍 我是一个ASP.NET MVC的开发者,最近在我找工作的时候被问到很多与HTML5相关的问题和新特性.所以以下40个重要的问题将帮助你复习HTML5相关的知识. 这些问题不是你得到工作的高效解决 ...
- 分析HTML5中WebSocket的原理
目录结构 一.什么是Websocket websocket是html5提出的一个协议规范,参考rfc6455. 不过目前还都是在草案,没有成为标准,毕竟html5还在路上. websocket约定 ...
- HTML5中的Web Workers
https://www.cnblogs.com/yanan-boke/p/6954390.html https://segmentfault.com/a/1190000014938305 HTML5 ...
随机推荐
- Word2003文档窗口分成上下两个独立的窗口
http://www.officezu.com/word/2003/index16.html 拆分窗口就是把一个Word2003文档窗口分成上下两个独立的窗口,从而可以通过两个Word2003文档窗口 ...
- linux C 内存分配（~道的光芒四射~）
总结一下C语言中基本的内存分配,加深对内存管理的印象,一步一步走山路~~~~~~~~ 1. 程序和进程 问题:程序和进程各是什么? 程序 只是一段可以执行的代码文件,通俗讲在 linux 上就是一个 ...
- css实现垂直居中的几种方法
方法1.这个方法把一些 div 的显示方式设置为表格,因此我们可以使用表格的 vertical-align 属性. #wrapper { //代表父元素 display: table; } #cell ...
- exit和return
函数名: exit() 所在头文件:stdlib.h(如果是”VC6.0“的话头文件为:windows.h) 功 能: 关闭所有文件,终止正在执行的进程. exit(1)表示异常退出.这个1是返回给操 ...
- Robot Framework 安装笔记
安装python 自行搜寻安装 安装pip 进入python目录下的Scripts文件夹下,cmd,执行easy_install.exe pip 安装pywin32 pip install pywin ...
- CTF-练习平台-Misc之 图片又隐写
八.图片又隐写 修改后缀名为zip,打开解压出两个文件 解压发现有密码,用WinHex打开发现文件头是zip的,所以出来把后缀名改为zip,再用工具爆破 最后得到解压密码,解压后是一个图片,改后缀名为 ...
- CTF密码学之凯撒加密
在加密的各种算法中,凯撒加密是最简单的也是最常见的一种加密方法,它的中心思想是替换,ROT加密其实就是凯斯加密的变种. 即明文的所有字母都在字母表上向后(或向前)按照一个固定数目进行偏移后被替换成密文 ...
- （dfs痕迹清理兄弟篇）bfs作用效果的后效性
dfs通过递归将每种情景分割在不同的时空,但需要对每种情况对后续时空造成的痕迹进行清理(这是对全局变量而言的,对形式变量不需要清理(因为已经被分割在不同时空)) bfs由于不是利用递归则不能分割不同的 ...
- hdu2085-2086
hdu2085 模拟 #include<stdio.h> ][]; void fun(){ a[][]=; a[][]=; ;i<=;i++){ a[i][]=*a[i-][]+*a ...
- Java8 （Function,Consumer,Predicate,Supplier）详解
1. https://blog.csdn.net/lzm18064126848/article/details/70199769 1.1 https://blog.csdn.net/turbo_zon ...