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;
}
},
//获取事件
getEvent: function(event) {
return event ? event : window.event;
},
//获取事件类型
getType: function(event) {
return event.type;
},
//获取元素
getElement: function(event) {
return event.target || event.srcElement;
},
//阻止事件默认行为
preventDefault: function(event) {
if(event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
},
//阻止事件冒泡
stopPropagation: function(event) {
if(event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;
}
}
}
window.onload=function(){
var go=document.getElementById('go'),
box=document.getElementById('box');
eventUtil.addHandler(box,'click',function(){
alert('我是整个父盒子');
});
eventUtil.addHandler(go,'click',function(e){
//e=eventUtil.getEvent(e);
e=e || window.event;
alert(eventUtil.getElement(e).nodeName);
eventUtil.preventDefault(e);
eventUtil.stopPropagation(e);
});
}
eventUtil的更多相关文章
- 跨浏览器事件EventUtil
<div style="width: 150px; height: 150px; padding: 25px; border:1px solid blue; " id=&qu ...
- 跨浏览器的事件对象-------EventUtil 中的方法及用法
什么是EventUti----封装好的事件对象 在JavaScript中,DOM0级.DOM2级与旧版本IE(8-)为对象添加事件的方法不同 为了以跨浏览器的方式处理事件,需要编写一段“通用代码”,即 ...
- EventUtil 根据IE自动适配事件
var EventUtil = { addHandler: function (element, type, handler) { if (element.addEventListener) { el ...
- JavaScript高级程序设计之EventUtil
简单的通用事件方法 var EventUtil = { getEvent: function (e) { return e || window.event; }, getTarget: functio ...
- 封装cookie.js、EventUtil.js、
最近学习了javascript,封装好的东西看起来舒服,以备需要的时候拉出来,jquery对javascript做了很好的封装!以后会多用jquery多些 var CookieUtil = { get ...
- EventUtil.addHandler方法
EventUtil.addHandler: addHandler 方法,职责是分别视情况而定来使用DOM0级方法.DOM2级方法或IE方法来添加事件. 这个方法属于一个名字叫EventUtil的对 ...
- 【前端】跨浏览器事件处理程序EventUtil.js个人注释及详解
<javascript高级程序设计>跨浏览器事件处理程序EventUtil.js个人注释 EventUtil.js // 跨浏览器事件处理程序封装 var EventUtil = { // ...
- EventUtil——跨浏览器的事件对象
. 首页 博客园 联系我 前言:什么是EventUtil?. EventUtil对象全见. addHandler方法. removeHandler方法. event对象与getEvent方法. tar ...
- Javascript之浏览器兼容EventUtil
var EventUtil = { //添加事件处理程序 addHandler: function (element, type, handler) { if (element.addEventLis ...
随机推荐
- 数据库中 关于不能用in 不能用exist 等关键字 查询不出现字段的问题
这是之前在网上见到的一道题,后来心里略微想了想 觉得应该可能,所以就一闪而过了,之前去面试晨光的时候面试者问了我这道问题,当时也只是把自己的想法说了一下,可能因为当时面试的感觉不太好,面试官也没有追究 ...
- 十一、Java基础---------内部类与匿名内部类
内部类分为普通内部类(有名)和匿名内部类.普通内部类分为成员内部类.局部内部类.静态内部类(嵌套内部类).顾名思义,内部类就是定义在一个类内部的类.什么时候都会使用内部类呢?当我们定义一个类,发现内部 ...
- 十、Java基础---------面向对象之抽象类与接口
抽象类(abstract) 当编写一个类时,时常会为该类定义一些方法,这些方法的使用用以描述该类的行为方式,那么这些方法都有具体的方法体.但是在某些情况下,某个父类只是知道子类应该包含怎样的方 ...
- GWT入门学习之下载安装
1.准备 安装 jdk: 下载路径:http://download.oracle.com/otn-pub/java/jdk/8u92-b14/jdk-8u92-windows-i586.exe?Aut ...
- 数据库连接driverClass和jdbcUrl大全
一.MySQL: driverClass:com.mysql.jdbc.Driver org.gjt.mm.mysql.Driver jdbcUrl:j ...
- OBD K线抓包
14230 Link 命令: const u8 LinkCmd14230[6] = { 0xC2, 0x33, 0xF1, 0x01, 0x00, 0xE7 }; 14230 Enter 命令: c ...
- SQL SERVER数据库的表中修改字段属性被阻止“Prevent saving changes that require table re-creation”
1.启动SQL SERVER,选择工具—>选项,去掉“ 阻止保存要求重新创建表的更改”前面的勾. 2.选择设计器 3.去掉“阻止保存要求重新创建表的更改”前面的对号,点击OK. 重新启动SQL ...
- code异常处理
private void copyPrivateRawResuorceToPubliclyAccessibleFile() { InputStream inputStream = null; File ...
- ubuntu15.04 安装 pylab失败,先记下来,漫漫看
pydo@planpls:/var/python/web2py$ pip install pylab Downloading/unpacking pylab Downloading pylab-0.1 ...
- iOS - Mac OS X 终端命令
Mac OS X 终端命令 1)显示当前目录的路径 pwd 2)列出文件 ls 参数 目录名 参数: -w 显示中文,-l 详细信息, -a 包括隐藏文件,每一行开头是 "d" 则 ...