所有分类
  • 所有分类
javascript自学记录:UI事件

javascript自学记录:UI事件

13.4 事件 下面封装了一个EventUtil,后面需要用到: var EventUtil = {addHandler: function (element, type, handler) {if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attach...

13.4 事件

下面封装了一个EventUtil,后面需要用到:

var EventUtil = {addHandler: function (element, type, handler) {if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent(“on” + type, handler); } else { element[“on” + type] = handler; } }, removeHandler: function (element, type, handler) {if (element.removeEventListener) { element.removeEventListener(type, handler, false); } else if (element.detachEvent) { element.detachEvent(“on” + type, handler); } else { element[“on” + type] = null; } }};

13.4.1 UI事件

可以使用下面的方法来判断浏览器是否支持不同等级的UI事件。

// 检测浏览器是否支持DOM2的UI事件var isSuported = window.document.implementation.hasFeature(“HTMLEvents”,“2.0”);alert(isSuported);// 检测浏览器是否支持DOM3的UI事件var isSuported3 = window.document.implementation.hasFeature(“UIEvent”,“3.0”);alert(isSuported3);

1、load事件

为window对象指定事件:

window.onload = function (event) {alert(“load”);};

也可以为某个元素指定UI事件,比如img.onload,

var img = document.getElementById(“myimg”);img.onload = function (event) {event = EventUtil.getEvent(event);alert(EventUtil.getTarget(event).src);};

2、unload

文档完全卸载后触发。当页面发生切换时也会触发。主要使用是清除引用,避免内在泄漏。

两种定义方式:

window.body.onunload = function (event) {alert(“unload”);};EventUtil.addHandler(window,“unload”,function (event) {alert(“unload”);});

注:网上说unload事件中的alert是无效的。但没找到方法进行证实。

3、resize

当浏览窗品大小发生变化时该事件被激活。

EventUtil.addHandler(window,“resize”,function (event) {console.log(“resize”);});

传入的event对象有一个target属性,他的值为document。

不同浏览器对resize事件处理不同,那么在这里不要添加大量计算代码,防止页面出现卡顿。

4、scroll

当滚动条变化位置时发生。注意由于会频繁触发,所以不要在此有大量的代码。

EventUtil.addHandler(window, “scroll”, function (event) {console.log(“scroll”);});

本页地址:http://www.uiya.cn/27235.html; 所有素材均来自于互联网,经网友投稿后发布,仅供学习请勿商用。如有侵权,请联系 3147141550@qq.com 或 提交工单

分享海报

评论0

站点公告

 

新注册用户福利,免费领取7~90天VIP会员

点击领取

没有账号? 注册  忘记密码?