js封装事件处理函数,兼容ie,支持事件代理

var eventUtil = {
bindEvent: function(el, type, target, callback, popgation) {
/**
* @author zhangtian
* @date 2017/11/16
* @desc 标准浏览器与ie事件兼容处理
* @augments el:事件源 type事件类型 target事件代理元素 callback回调函数 popgation是否冒泡
*/
var caption = caption || true; //默认为冒泡 //如果不使用事件代理,target置空
if((typeof target) == "function") {
callback = target;
target = null;
} if(el.addEventListener) {
el.addEventListener(type, function(e) {
if(target) {
console.log("事件代理");
if(e.target == target) {
callback.call(target, e); //改变this指向,如果不用call,this指向window
}
} else {
console.log("普通事件");
callback.call(el, e); //改变this指向,如果不用call,this指向window
}
}, popgation);
} else if(el.attachEvent) {
el.attachEvent("on" + type, function() {
var e = window.event;
if(target) {
console.log("事件代理");
if(e.srcElement == target) {
callback.call(target, e); //改变this指向,如果不用call,this指向window
}
} else {
console.log("普通事件");
callback.call(el, e); //改变this指向,如果不用call,this指向window
}
});
}
},
stopPropagation: function(e) {
var event = e || window.event;
if(event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;
}
},
preventDefault: function(e) {
var event = e || window.event;
if(event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
}
};

js事件兼容处理的更多相关文章

  1. js 事件监听 兼容浏览器

    js 事件监听 兼容浏览器   ie 用 attachEvent   w3c(firefox/chrome)  用 addEventListener 删除事件监听 ie 用 detachEven   ...

  2. js event 事件兼容浏览器 ie不需要 event参数 firefox 需要

    js event 事件兼容浏览器    ie不需要 event参数   firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

  3. js事件的一些兼容写法

    事件兼容 事件对象的兼容 获取键码兼容 默认行为兼容 阻止事件冒泡兼容 事件监听兼容 ---- 封装 删除事件监听兼容 ---- 封装 事件委托->获取事件源兼容

  4. js事件技巧方法整合

    window.resizeTo(800,600); //js设置浏览器窗口尺寸 window.open (function(){ resizeTo(640,480);//设置浏览器窗口尺寸 moveT ...

  5. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  6. JS事件

    JS事件:  声明:为了事件对象event跨浏览器兼容: var oEvent==ev||event;      所以在下面用到 event 的地方都用 oEvent 代替  1)doucument的 ...

  7. js 事件

    事件:一般用于浏览器与用户操作进行交互 js事件的三种模型:内联模型.脚本模型.DOM2模型 内联模型:事件处理函数是HTML标签的属性 <input type="button&quo ...

  8. js事件监听器用法实例详解

    这篇文章主要介绍了js事件监听器用法,以实例形式较为详细的分析了javascript事件监听器使用注意事项与相关技巧,需要的朋友可以参考下本文实例讲述了js事件监听器用法.分享给大家供大家参考.具体分 ...

  9. js事件绑定细节说明

    javascript绑定事件: 经常用jQuery去写,时间长了对原生态的js事件绑定的知识会慢慢淡化或者遗忘了,必须翻出来再次总结,今天再次把js原生态事件的处理做个总结. 从最初开始,谁刚接触ja ...

随机推荐

  1. BZOJ2876 [Noi2012]骑行川藏 【拉格朗日乘数法】

    题目链接 BZOJ 题解 拉格朗日乘数法 拉格朗日乘数法用以求多元函数在约束下的极值 我们设多元函数\(f(x_1,x_2,x_3,\dots,x_n)\) 以及限制\(g(x_1,x_2,x_3,\ ...

  2. 毕业设计预习:SM3密码杂凑算法基础学习

    SM3密码杂凑算法基础学习 术语与定义 1 比特串bit string 由0和1组成的二进制数字序列. 2 大端big-endian 数据在内存中的一种表示格式,规定左边为高有效位,右边为低有效位.数 ...

  3. Kafka 接受数据并消费到hbase数据库

    一. 1.生产者 产生数据 package kafakaTohbase; import java.util.Properties; import kafka.javaapi.producer.Prod ...

  4. 【线段树合并】【P2824】 [HEOI2016/TJOI2016]排序

    Description 给定一个长度为 \(n\) 的排列,有 \(m\) 次操作,每次选取一段局部进行升序或降序排序,问你一波操作后某个位置上的数字是几 Hint \(1~\leq~n,~m~\le ...

  5. .net 控件开发常见的特性总结

    http://blog.csdn.net/aofengdaxia/article/details/5924364 在.net开发中常常需要使用一些[]里面的特性描述,我发现对常用的几个知道大概的意思, ...

  6. Chapter 3(线性表)

    1.单链表 //单链表代码,手打纯手工 //***********************************link.h*********************************** # ...

  7. Docker login报错一例

    在一台ubuntu 18.04上执行docker login 登录镜像仓库的时候,抛出如下异常: error getting credentials - err: exit status 1, out ...

  8. CODEVS 2171 棋盘覆盖

    2171 棋盘覆盖 给出一张nn(n<=100)的国际象棋棋盘,其中被删除了一些点,问可以使用多少12的多米诺骨牌进行掩盖. 错误日志: 直接在模板上调整 \(maxn\) 时没有在相应邻接表数 ...

  9. c# string 和 byte[]数组之间转换

    在文件流读取和存储过程当中,经常涉及到byte[]数组形式存储数据,再此过程中也涉及到String类型字符串和byte[]的类型转换,下面我们举例说明一下. 现在有一个字符串: string str ...

  10. Oracle数据库代码指令简介

    重大提醒!!!oracle里面的查询,一定要把查询名大写!!!就算你创建的时候是小写字母,查询的时候也一定要大写!!! 这是oracle的课后作业,弄懂这些也差不多了吧,不懂的可以去看我的SQL se ...