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

  我用来测试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. position三种属性的区别

    1.static(静态定位):默认值.没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明). 2.relative(相对定位):生成相对 ...

  2. Adversarial Examples for Semantic Segmentation and Object Detection 阅读笔记

    Adversarial Examples for Semantic Segmentation and Object Detection (语义分割和目标检测中的对抗样本) 作者:Cihang Xie, ...

  3. PHP安装过程中问题详解

    安装Apace时我就犯了一个大错误.因为我的母语是JAVA,我以为Tomcat就是Apache.其实不然,Tomcat是给Java用的,处理JSP等的动态页面. 而PHP则是单纯的用Apache安装A ...

  4. 专业的“python爬虫工程师”需要学习哪些知识?

    学到哪种程度 暂且把目标定位初级爬虫工程师,简单列一下吧: (必要部分) 熟悉多线程编程.网络编程.HTTP协议相关 开发过完整爬虫项目(最好有全站爬虫经验,这个下面会说到) 反爬相关,cookie. ...

  5. Python机器学习(基础篇---监督学习(k近邻))

    K近邻 假设我们有一些携带分类标记的训练样本,分布于特征空间中,对于一个待分类的测试样本点,未知其类别,按照‘近朱者赤近墨者黑’,我们需要寻找与这个待分类的样本在特征空间中距离最近的k个已标记样本作为 ...

  6. php优秀框架codeigniter学习系列——CI_Input类学习

    这篇文章主要介绍CI核心框架工具类CI_Input. 根据CI文档自己的定义,该类用来: 提前处理全局变量,以保证安全; 提供一些帮助函数用来处理输入数据. 以下选取类中的重点方法进行说明. __co ...

  7. Linux 常用命令和使用技巧

    一.Shell命令 shell通配符------"*"."?"."[]" shell管道-------|把命令连接起来,把第一个命令的输出作 ...

  8. mysql 实现 sqlserver的row_number over() 方法

    1.创建表 CREATE TABLE `heyf_t10` ( `empid` int(11) DEFAULT NULL, `deptid` int(11) DEFAULT NULL, `salary ...

  9. PaperBye-一个可以自动改重的免费论文查重网站

    推荐一个自动降重的免费论文查重软件,可自动降低论文重复率,一边修改,一边查重,免费查重网址:https://www.paperbye.com

  10. pycharm介绍

      PyCharm是一种Python IDE(集成开发软件),带有一整套可以帮助用户在使用Python语言开发时提高其效率的工具. 1.1 PyCharm主界面 PyCharm包含4个主要区分,分别为 ...