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

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

  1. <body ononline="onFunction()" onoffline="offFunction()">
  2. <p>测试ononline事件和onoffline事件</p>
  3. <script type="text/JavaScript">
  4. function onFunction() {
  5. alert("现在你的浏览器有网络,在线工作");
  6. }
  7. function offFunction() {
  8. alert("现在你的浏览器没有网络,离线工作");
  9. }
  10. </script>
  11. </body>

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

  

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

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

  1. <body onload="loadOver()">
  2. <p>测试ononline事件和onoffline事件</p>
  3. <script type="text/JavaScript">
  4. function loadOver() {
  5. var x = document.getElementsByTagName("p")[0];
  6. if(navigator.onLine){
  7. x.innerHTML = "在线工作";
  8. }
  9. else {
  10. x.innerHTML = "离线工作";
  11. }
  12. }
  13. </script>
  14. </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. C++ MySQL编程

    MySQL编程需要包含<mysql.h>头文件.该文件一般在MySQL安装目录下的include文件夹下. 包含头文件还不够,还需要包含“libmysql.lib”库,一般在lib文件夹下 ...

  2. Debian 系linux切换登录管理器(display manager)

    在控制台中sudo dpkg-reconfigure <你的dm包名>即可dm选择列表,选择自己需要的dm 例如ubutu18默认使用gdm3,则输入命令: sudo dpkg-recon ...

  3. input()和print()函数同时输入输出多个数据--python3

    使用input()和print()函数同时输入输出多个数据,需要空格分割输入信息 #!/usr/bin/python3#-*- conding:utf-8 -*- name, age, QQ = in ...

  4. ln语法

    Linux文件系统中,有所谓的链接(link),我们可以将其视为档案的别名,而链接又可分为两种 : 硬链接(hard link)与软链接(symbolic link),硬链接的意思是一个文件可以有多个 ...

  5. 2019-04-19-day036-协程与进程池

    内容回顾 11:30 码云 :王老师检查作业+定期抽查 注册账号 考试的时间 threading.enumerate(),能够获取到当前正在运行的所有线程对象列表 守护线程 守护线程会等待所有的非守护 ...

  6. 判断库中为字符串格式的时间是否为最近三个月(Java)

    今天分享一个问题,就是标题中提到的问题,今天在调用一个接口的时候,发现调用到的数据的时间格式为字符串类型,我有点蒙圈,于是,我就百度解决了这个问题,同时在这里记录一下,为了之后不再蒙圈::: 首先需要 ...

  7. JdbcTemplate 配置多数据源(完全照抄,完整)

    <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://mave ...

  8. wps 邮件 通讯小灵通 长沙杭州

    记得在天涯上看过一个热贴,关于贵族与世家的,文中提到号称当今贵族的六大世家,什么“汝南周氏”.“吴兴沈氏”之类,更有甚者,为了比拼,追本溯源,把孔子他老人家也抬了出来,号称孔夫子的多少多少代传人,当时 ...

  9. linux 保存git的账号密码

    今天在弄jenkins一建发版,遇到了git下载每次都要输入账号密码,所以百度一下,使用一下方法,搞定 一.通过文件方式 1.在~/下, touch创建文件 .git-credentials, 用vi ...

  10. python3 sys.path

    wadmin@ansible-test:~/python$ python3Python 3.6.7rc1 (default, Sep 27 2018, 09:51:25) [GCC 8.2.0] on ...