unload事件

　　当页面卸载或用户从当前页面换到其他页面上时，会在window上触发unload事件。根据DOM2级规范规定，unload应该在body上触发，但所有浏览器都实现了在window上触发unload，以保证向后兼容。

　　与load事件相同，也有两种绑定方式，推荐使用JavaScript方式：

<!-- html特性方式 -->

<html>

<head></head>

<body unload="alert(unloaded!)"></body>

</html>
//JavaScript方式

EventUtil.addEvent(window,'unload',function(event){

    alert('unloaded!');

});

resize事件

当浏览器窗口大小发生变化时，会在window上触发resize事件；注意，firefox浏览器会在窗口大小停止变化时才触发resize事件，而其他浏览器则在窗口发生1px的变化就触发，因此建议不要在你resize事件处理程序中有大量的计算。

scroll事件

当页面随滚动条滚动时会触发连续scroll事件；混杂模式下，基于body计算滚动距离，在标准模式下，基于document计算滚动距离：

EventUtil.addEvent(window,'scroll',function(event){

    var event = EventUtil.getEvent(event);

    if(document.compatMode=='CSS1Compat){

        alert(document.documentElement.scrollTop);

    }else{

        alert(document.body.scrollTop);

    }

});

UI事件之unload、resize和scroll的更多相关文章

  1. Javascript高级编程学习笔记（61）—— 事件（5）UI事件

    UI事件 UI事件是指那些不一定与用户操作有关的事件 这些事件在DOM规范出现之前,都是以各种不同的形式存在于不同的浏览器 而在DOM事件中为了保证向后兼容,现有的UI事件如下: DOMActivat ...

  2. 事件类型-UI事件、焦点事件

    DOM3级事件包括以下几类事件: UI事件:当用户与页面上的元素交互时触发 焦点事件:当元素获得或失去焦点时触发 鼠标事件:当用户通过鼠标在页面上执行操作时触发 滚轮事件:当使用鼠标滚轮时触发 文本事 ...

  3. React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路

    React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路 这几天在忙着把自己做的项目中的类组件转化为功能相同的函数组件,首先先贴一份该组件类组件的关 ...

  4. UI事件监听的击穿

    什么是UI事件监听的击穿 在游戏视图中,有两个UI界面叠在一起的时候,单击一个空白处,却触发了被覆盖在下层了UI界面中的单击事件,这就是单击击穿了上层界面. 假设场景中放置了一个箱子,单击箱子会触发一 ...

  5. UI事件之load

    load事件属于CSS3规范中的UI事件,load事件处理程序在页面元素和资源(html/script/link/img等)全部加载完成后在window上触发,或在img元素加载完成后再img元素上触 ...

  6. Android学习笔记－－处理UI事件

    Handling UI Events 在Android里, 有不只一种方式可以截获用户与你的应用程序交互的事件. 在你的界面上处理事件时,你需要捕获用户与某个View实例交互时所产生的事件.View类 ...

  7. UI事件与内容，舞台与演员

    UI事件:创建/清除/显示/隐藏/填充内容/位置变化/形态变化/尺寸变化/颜色变化/ 非UI事件:点击/输入/拖动/

  8. unity UI事件

    由于工作需要到持续按键,所以了解了一下unity UI事件,本文主要转载于http://www.cnblogs.com/zou90512/p/3995932.html?utm_source=tuico ...

  9. window resize和scroll事件的基本优化

    转自 http://www.kankanews.com/ICkengine/archives/6564.shtml

随机推荐

  1. Deppon接口开发

    一.1)  支持的传输协议  http ,暂时只支持HTTP协议进行通信. (2) 支持的数据传输格式  Json  ,所有接口暂只支持json消息格式. (3) 编码格式:UTF-8   交互编码格 ...

  2. Eclipse开发Android项目安装配置

    在windows安装Android的开发环境不简单也说不上算复杂,本文写给第一次想在自己Windows上建立Android开发环境投入Android浪潮的朋友们,为了确保大家能顺利完成开发环境的搭建, ...

  3. XHR 框架与 Dojo( xhrGet,xhrPut,xhrDelete)

    总结 本文介绍了 Dojo 中三种浏览器与服务器交互的方式,这三种方式各有优缺点,但是在使用方式却出奇的一致: xhr 框架的函数,dojo.io.iframe.dojo.io.script 对象的函 ...

  4. c# 数据库缓存依赖

    1.为缓存依赖项启动通知数据库 在vs开发人员命令提示中运行(切换到aspnet_regsql.exe所在目录,示例目录:C:\Windows\Microsoft.NET\Framework64\v4 ...

  5. 关于box-sizing的理解

    ---恢复内容开始--- box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素. 例如,假如您需要并排放置两个带边框的框,可通过将 box-sizing 设置为 "bord ...

  6. Single Number,Single Number II

    Single Number Total Accepted: 103745 Total Submissions: 218647 Difficulty: Medium Given an array of ...

  7. 使用ICE进程间通信时，IP和端口的选择

    使用ICE进程间通信时,IP和端口的选择 服务器在创建时使用的Endpint格式为 tcp  -h IP地址 -p 端口 1.IP地址的选择 如果填某个网卡的地址,则只在这个地址上监听,客户端必须连这 ...

  8. Java三大特征之继承(二)

    在<Think in java>中有这样一句话:复用代码是Java众多引人注目的功能之一.但要想成为极具革命性的语言,仅仅能够复制代码并对加以改变是不够的,它还必须能够做更多的事情.在这句 ...

  9. 初始AngularJS

    <!-- AngularJS 通过 ng-directives 扩展了 HTML. ng-app 指令定义一个 AngularJS 应用程序. ng-model 指令把元素值(比如输入域的值)绑 ...

  10. Leetcode 283 Move Zeroes python

    题目: Given an array nums, write a function to move all 0's to the end of it while maintaining the rel ...