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. java 除法向上,向下取整

    向上取整用Math.ceil(double a) 向下取整用Math.floor(double a) // 举例: double a=35; double b=20; double c = a/b; ...

  2. -XX:-PrintClassHistogram 按下Ctrl+Break后,打印类的信息

    -XX:+PrintClassHistogram –按下Ctrl+Break后,打印类的信息: num     #instances         #bytes  class name ------ ...

  3. iOS使用textfield注意的细节

    一般做登录界面或者要填写表之类的页面会经常使用到textfield.使用很简单,但是其实他有很多小的处理细节,这回让你显得有经验,交互性很好.在这里呢,我就直接拿stroyboard中的截图来说. c ...

  4. popUpWindow 动画无法超出窗体的解决方案

    popupWindow 做动画时,当要求有一个放大动画时,动画无法超出窗体,给人的感觉是只有内容在放大,窗体不动. 这是由于窗口大小固定的原因,解决方案是加大popUpwindow的 大小. 一个比较 ...

  5. [LeetCode_1] twoSum

    LeetCode: 1. twoSum 题目描述 Given an array of integers, return indices of the two numbers such that the ...

  6. 如何使用Python调用AutoIt来实现Flash控件的上传功能

    先看一段代码 upload.au3(这个后缀autoit3的格式): ;等待出现title为数据采集-军课网-MozillaFirefox的浏览器窗口 WinWait("数据采集 - XX网 ...

  7. docker图形界面工具

    好久不打开docker运行环境,执行命令出现下面的情况 bgddeMBP:~ bgd$ sudo docker info Cannot connect to the Docker daemon. Is ...

  8. iOS - Mac Apache WebServer 服务器配置

    前言 Apache 是目前使用最广的 Web 服务器,可以支持各种脚本的执行. Mac 系统自带,无需单独安装,只需要修改几个配置就可以,简单,快捷. 有些特殊的服务器功能,Apache 都能很好的支 ...

  9. 【hdu4366】dfs序线段树

    #include <bits/stdc++.h> #define ll long long #define lson l, m, rt<<1 #define rson m+1, ...

  10. IDEA maven项目 包不能导入问题 全是红线

    情况如图所示,红线的话里肯定是没有maven包的 1.检查pom.xml是否报错 报错 右键添加一下 2.点击 3.出现错误提示 4.百度解决