关于这个事件的描述到处都有,但基本上都是说离线在线什么的我一下子还没反应过来。后再在这里看到了一句话:"断开网络再联网试试,就可以看到连线的提示。"这才反应过来,原来指的是网络状态。

  我用来测试ononline事件和onoffline事件的例子:

 <body ononline="onFunction()" onoffline="offFunction()">
<p>测试ononline事件和onoffline事件</p>
<script type="text/JavaScript">
function onFunction() {
alert("现在你的浏览器有网络,在线工作");
}
function offFunction() {
alert("现在你的浏览器没有网络,离线工作");
}
</script>
</body>

  测试方法:打开这个页面,切断网络,就会触发

  

  (我用的录制GIF的软件不能录制任务栏,反正就是我先断网,然后再联网。)

  你启动这个页面是不会触发ononline和onoffline事件的,得网络状态发生变化才触发。如果想要在页面打开的时候就判断现在是在线状态还是离线状态,可以使用一个只读属性:navigator.onLine

 <body onload="loadOver()">
<p>测试ononline事件和onoffline事件</p>
<script type="text/JavaScript">
function loadOver() {
var x = document.getElementsByTagName("p")[0];
if(navigator.onLine){
x.innerHTML = "在线工作";
}
else {
x.innerHTML = "离线工作";
}
}
</script>
</body>

  运行效果如下: 

 

  

  

JavaScript中的ononline事件和onoffline事件的更多相关文章

  1. JavaScript中,有三种常用的绑定事件的方法

    要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有三种常用的 ...

  2. 让你高效的理解JavaScript中的同步、异步和事件循环

    "同步请求","异步请求"相信这两词在程序猿的世界中频频出现,到底是词性的妖娆,还是撸代码的基础要求,下面直接分享本人学习的好东西,保证让你深入浅出,爽得不要不 ...

  3. javascript中区分鼠标单击和拖动事件

    在javascript中,一般的DOM元素如div,都有onmousedown.onmousemove.onmouseup这3个鼠标事件. <div id="div1" on ...

  4. javascript 中 keyup、keypress和keydown事件

    keyup.keypress和keydown事件都是有关于键盘的事件 1. keydown事件在键盘的键被按下的时候触发,keyup 事件在按键被释放的时候触发    keydown.keypress ...

  5. javascript中事件总结&通用的事件侦听器函数封装&事件委托

    前言: JAVASCRIPT与HTML之间的交互是通过事件来实现的.事件,就是文档或浏览器窗口中发生的一些特定交互瞬间.可以使用侦听器( 或处理程序 )来预定事件,以便事件发生时执行相应的代码.这种在 ...

  6. JS 中的事件绑定、事件监听、事件委托

    事件绑定 要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有 ...

  7. JS 中的事件绑定、事件监听、事件委托是什么?

    在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定.事件监听.事件委托(事件代理)等.这些名词是什么意思呢,有什么作用呢? 事件绑定 要想让 JavaScri ...

  8. JavaScript中错误正确处理方式,你用对了吗?

    JavaScript的事件驱动范式增添了丰富的语言,也是让使用JavaScript编程变得更加多样化.如果将浏览器设想为JavaScript的事件驱动工具,那么当错误发生时,某个事件就会被抛出.理论上 ...

  9. JS 事件绑定、事件监听、事件委托详细介绍

    原:http://www.jb51.net/article/93752.htm 在JavaScript的学习中,我们经常会遇到JavaScript的事件机制,例如,事件绑定.事件监听.事件委托(事件代 ...

随机推荐

  1. VGG网络结构

    这个结构其实不难,但是它里面训练的一些东西我还没有搞清楚,打算把昨天写的代码传上来,方便日后来看,发现了一个很有意思的库叫TF-slim打算哪天看看有没有好用的东西 from datetime imp ...

  2. git clone 带用户名密码

    git使用用户名密码clone的方式: git clone http://username:password@remote eg: username:  abc@qq.com, pwd: test, ...

  3. python基础(字符串常用方法)

    字符串不常用方法: 字符串常用的方法: #看源代码 按住ctrl点击方法名 用户注册的小程序 import datetimeusers = []passwds = []for i in range(3 ...

  4. 谱聚类(Spectral Clustring)原理

    谱聚类(spectral clustering)是广泛使用的聚类算法,比起传统的K-Means算法,谱聚类对数据分布的适应性更强,聚类效果也很优秀,同时聚类的计算量也小很多,更加难能可贵的是实现起来也 ...

  5. C++面试笔记(1)

    1. C和C++的区别 C++面向对象的三大特性 面向对象的三个基本特征:封装.继承.多态 1.封装:把客观事物封装成抽象的类,类进行信息隐藏 关键字 |当前类 |包内 |子孙类| 包外 --|--| ...

  6. Hadoop 搭建集群的步骤

    1.安装jdk,配置环境变量 root@localhost java]# vi /etc/profile 在profile中添加如下内容: #set java environmentexport  J ...

  7. MYSQL ini 配置文件详解及性能优化方案

    my.ini分为两块:Client Section和Server Section.   Client Section用来配置MySQL客户端参数.   要查看配置参数可以用下面的命令: show va ...

  8. ABP框架(asp.net core 2.X+Vue)模板项目学习之路(二)--切换MySql数据库

    前言: 大家好,今天给大家带来ABP第二篇的分享,在写这篇分享的时候非常的困难,因为发现ABP的框架越是深入.难度也就越大,而且深刻感觉到自己领域驱动开发知识的欠缺,前段时间买了两本有关于领域驱动知识 ...

  9. Verdi 看波形常用快捷操作

    Verdi看波形的基本操作小结: 快捷键:(大写字母=Shift+小写) g    get, signlas添加信号,显示波形n    next, Search Forward选定信号按指定的值(上升 ...

  10. react-native-svg的使用

    今天学习一下react-native-svg,一如既往,在安装该库的时候,就有一大堆坑等你填. 首先,我新建一个rn项目,按照官方说明先导入库 npm install react-native-svg ...