js事件兼容处理
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事件兼容处理的更多相关文章
- js 事件监听 兼容浏览器
js 事件监听 兼容浏览器 ie 用 attachEvent w3c(firefox/chrome) 用 addEventListener 删除事件监听 ie 用 detachEven ...
- js event 事件兼容浏览器 ie不需要 event参数 firefox 需要
js event 事件兼容浏览器 ie不需要 event参数 firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...
- js事件的一些兼容写法
事件兼容 事件对象的兼容 获取键码兼容 默认行为兼容 阻止事件冒泡兼容 事件监听兼容 ---- 封装 删除事件监听兼容 ---- 封装 事件委托->获取事件源兼容
- js事件技巧方法整合
window.resizeTo(800,600); //js设置浏览器窗口尺寸 window.open (function(){ resizeTo(640,480);//设置浏览器窗口尺寸 moveT ...
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...
- JS事件
JS事件: 声明:为了事件对象event跨浏览器兼容: var oEvent==ev||event; 所以在下面用到 event 的地方都用 oEvent 代替 1)doucument的 ...
- js 事件
事件:一般用于浏览器与用户操作进行交互 js事件的三种模型:内联模型.脚本模型.DOM2模型 内联模型:事件处理函数是HTML标签的属性 <input type="button&quo ...
- js事件监听器用法实例详解
这篇文章主要介绍了js事件监听器用法,以实例形式较为详细的分析了javascript事件监听器使用注意事项与相关技巧,需要的朋友可以参考下本文实例讲述了js事件监听器用法.分享给大家供大家参考.具体分 ...
- js事件绑定细节说明
javascript绑定事件: 经常用jQuery去写,时间长了对原生态的js事件绑定的知识会慢慢淡化或者遗忘了,必须翻出来再次总结,今天再次把js原生态事件的处理做个总结. 从最初开始,谁刚接触ja ...
随机推荐
- 【bzoj2594】 Wc2006—水管局长数据加强版
http://www.lydsy.com/JudgeOnline/problem.php?id=2594 (题目链接) 题意 给出一个带边权的无向简单,要求维护两个操作,删除${u,v}$之间的连边: ...
- Web Service(上)
1.XML CDATA指不应由XML解析器进行解析的文本数据. 在XML元素中,<和&是非法的.解析器会把字符<解释为新元素的开始,把字符&解释为字符实体的开始. 某些文本 ...
- (转)java getResourceAsStream的使用方法
背景:对于java项目中配置文件加载时候的绝对路径和相对路径做一个清晰的认识! 1 分析路径 在Java项目中会经常用到getResourceAsStream这个函数获取一些配置文件,但是怎样正确使用 ...
- Jenkins(三)---Jenkins初始配置和插件配置
从Jenkins(二)中可以知道 jenkins 的工作目录为/opt/jenkins [很重要!!!][很重要!!!][很重要!!!]在配置此目录以前,将这两台的主机进行配置为ssh root用户无 ...
- linux命令总结之seq命令
功能: seq命令用于产生从某个数到另外一个数之间的所有整数. 语法: seq [选项]... 尾数 seq [选项]... 首数 尾数 seq [选项]... 首数 增量 尾数 选项: -f, -- ...
- java 锁的分类
java中为了解决多线程并发带来的线程安全问题,引入了锁机制. 一.公平锁和非公平锁 1.公平锁:按照申请锁的顺序(FIFO队列)来获取锁. 2.非公平锁:所有线程都会竞争,获取的锁的顺序和申请顺序无 ...
- sql server 日志文件占用过多空间
问题描述: 在sql server的log文件夹中存在大量的mdmp.log文件,整体占用了几十个G C:\Program Files (x86)\Microsoft SQL Server\MSSQL ...
- oracle改进之将阿拉伯数字转换成中文数字
本博客是自己在学习和工作途中的积累与总结,仅供自己参考,也欢迎大家转载,转载时请注明出处 http://www.cnblogs.com/king-xg/p/6839738.html 将阿拉伯数字转 ...
- windows安装filebeat服务报错
cmd进入filebeat目录下 用以下命令执行: PowerShell.exe -ExecutionPolicy UnRestricted -File .\install-service-fil ...
- 【BZOJ】2006: [NOI2010]超级钢琴
[题意]给定长度为n的整数序列,求长度为[L,R]的前k大区间和的和.n,k<=500000. [算法]堆+贪心+RMQ [题解]考虑暴力是取所有长度为[L,R]的子串的前k大求和,复杂度O(n ...