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的更多相关文章

  1. 跨浏览器事件EventUtil

    <div style="width: 150px; height: 150px; padding: 25px; border:1px solid blue; " id=&qu ...

  2. 跨浏览器的事件对象-------EventUtil 中的方法及用法

    什么是EventUti----封装好的事件对象 在JavaScript中,DOM0级.DOM2级与旧版本IE(8-)为对象添加事件的方法不同 为了以跨浏览器的方式处理事件,需要编写一段“通用代码”,即 ...

  3. EventUtil 根据IE自动适配事件

    var EventUtil = { addHandler: function (element, type, handler) { if (element.addEventListener) { el ...

  4. JavaScript高级程序设计之EventUtil

    简单的通用事件方法 var EventUtil = { getEvent: function (e) { return e || window.event; }, getTarget: functio ...

  5. 封装cookie.js、EventUtil.js、

    最近学习了javascript,封装好的东西看起来舒服,以备需要的时候拉出来,jquery对javascript做了很好的封装!以后会多用jquery多些 var CookieUtil = { get ...

  6. EventUtil.addHandler方法

    EventUtil.addHandler: addHandler 方法,职责是分别视情况而定来使用DOM0级方法.DOM2级方法或IE方法来添加事件.   这个方法属于一个名字叫EventUtil的对 ...

  7. 【前端】跨浏览器事件处理程序EventUtil.js个人注释及详解

    <javascript高级程序设计>跨浏览器事件处理程序EventUtil.js个人注释 EventUtil.js // 跨浏览器事件处理程序封装 var EventUtil = { // ...

  8. EventUtil——跨浏览器的事件对象

    . 首页 博客园 联系我 前言:什么是EventUtil?. EventUtil对象全见. addHandler方法. removeHandler方法. event对象与getEvent方法. tar ...

  9. Javascript之浏览器兼容EventUtil

    var EventUtil = { //添加事件处理程序 addHandler: function (element, type, handler) { if (element.addEventLis ...

随机推荐

  1. SQL批量添加主键脚本

    --SQL批量添加主键脚本 --操作提示:运行此脚本前请记得备份您要操作的数据库 --实现功能:执行脚本后数据库中的所有数据表都会有一个主键 --添加规则1:主键名称为ID(可自己修改),数据类型为整 ...

  2. 转 C# 装箱和拆箱[整理]

    1.      装箱和拆箱是一个抽象的概念 2.      装箱是将值类型转换为引用类型 :拆箱是将引用类型转换为值类型       利用装箱和拆箱功能,可通过允许值类型的任何值与Object 类型的 ...

  3. IOS new Date() 时间转换失败问题以及其他问题

    一: ios下必须标准格式用'/'分割格式 转换没问题:  new Date('2016/5/30 12:15:20') 二:ie9兼容模式以及以下ie版本 console用前需判断 if(windo ...

  4. 隐式意图Intent

    在我们想往下一个页面传递数据时,要想到显式意图和隐式意图,显示意图用于内部活动跳转时比较方便,而隐式意图用于应用程序中外部活动的跳转时较为方便,在使用隐式意图时我们要想到清单文件 代码如下: < ...

  5. python简单实现用户表单登录

    实现简单的用户表单验证登录 user="desperado" pwd=" s=0 for i in range(10): if s < 3: username = ...

  6. 编写一个JSP程序实现用户登录

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  7. Linux sticky bit 目录权限 rwt权限

    [linux权限分为 user group others三组] 今天看到有个目录的权限是rwxrwxrwt 很惊讶这个t是什么,怎么不是x或者-呢?搜了下发现: 这个t代表是所谓的sticky bit ...

  8. 《BI那点儿事》数据流转换——审核

    审核转换允许对数据流添加审核审核数据,以往使用HIPPA和Sarbanes-Oxley (SOX)时,必须跟踪谁在什么时插入数据,审核转换可以实现这种功能.例如要跟踪那一个task向表里插入数据,可以 ...

  9. 转 一个典型的 C++ 程序员成长经历:

    1.  完整的学一遍 C++ 所有语言特性,典型书籍 "The C++ Programming Language" Part1, Part2, "C++ Primer&q ...

  10. CSSOM之getComputedStyle,currentStyle,getPropertyValue,getAttribute

    js关于CSSOM编程的样式相关几个常用的方法 webkit:getComputedStyle,getPropertyValue IE:currentStyle,getAttribute 前言 jqu ...