js事件监听/鼠标滚轮/行为/冒泡/键盘的兼容性写法
addEvent:function(el,type,fn,capture) {
if (window.addEventListener) {
if (type === "mousewheel" && document.mozHidden !== undefined) {
type = "DOMMouseScroll";
}
el.addEventListener(type, fn, !!capture);
} else if (window.attachEvent) {
el.attachEvent("on" + type, fn);
}
},
removeEvent:function(el,type,fn,capture) {
if (window.removeEventListener) {
if (type === "mousewheel" && document.mozHidden !== undefined) {
type = "DOMMouseScroll";
}
el.removeEventListener(type, fn, !!capture);
} else if (window.detachEvent) {
el.detachEvent("on" + type, fn);
}
},
//对鼠标滚轮、行为、冒泡以及键盘做的兼容性处理
eventCompat:function(e) {
e || (e = root.event);
var type = e.type;
if (type == 'DOMMouseScroll' || type == 'mousewheel') {
e.delta = (e.wheelDelta) ? -e.wheelDelta / 120 : (e.detail || 0) / 3;
}
if (e.srcElement && !e.target) {
e.target = e.srcElement;
}
//阻止默认行为
if (!e.preventDefault) {
e.preventDefault = function() {
e.returnValue = false;
};
}
//阻止冒泡
if (!e.stopPropagation && e.cancelBubble !== undefined) {
e.stopPropagation = function() {
e.cancelBubble = true;
};
}
//键盘的兼容性处理
if(e.which == null){
e.which = e.charCode != null ? e.charCode : e.keyCode;
}
/*
......其他一些兼容性处理 */
return e;
},
bindAsEventListener:function(context, fun) {
var self = this;
return function(e) {
return fun.call(context, self.eventCompat(e));
}
}
//调用:
var dom = document.getElementById('btn');
var object = {
clickCtrl:function(e){
alert(e);
}
};
addEvent(dom, "click", function(){
alert(dom.id);
});
addEvent(dom, "mousedown",
bindAsEventListener(object, function(e){
object.ClickCtrl(e);
}));
js事件监听/鼠标滚轮/行为/冒泡/键盘的兼容性写法的更多相关文章
- js 事件监听 冒泡事件
js 事件监听 冒泡事件 的取消 [自己写框架时,才有可能用到] <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitiona ...
- js事件监听机制(事件捕获)总结
在前端开发过程中我们经常会遇到给页面元素添加事件的问题,添加事件的js方法也很多,有直接加到页面结构上的,有使用一些js事件监听的方法,由于各个浏览器对事件冒泡事件监听的机制不同,le浏览器只有事件冒 ...
- js事件监听机制(事件捕获)
在前端开发过程中我们经常会遇到给页面元素添加事件的问题,添加事件的js方法也很多,有直接加到页面结构上的,有使用一些js事件监听的方法,由于各个浏览器对事件冒泡事件监听的机制不同,le浏览器只有事件冒 ...
- java 事件监听 - 鼠标
java 事件监听 - 鼠标 //事件监听 //鼠标事件监听 //鼠标事件监听有两个实现接口 //1.MouseListener 普通的鼠标操作 //2.MouseMotionListener 鼠标的 ...
- js 事件监听 兼容浏览器
js 事件监听 兼容浏览器 ie 用 attachEvent w3c(firefox/chrome) 用 addEventListener 删除事件监听 ie 用 detachEven ...
- javascript的事件监听与捕获和冒泡
在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调来进行相关的操作. 而js中事件监听方法总共有三种,分别如下所示: element.addEventL ...
- js 事件监听封装
var eventUtil={//添加句柄 //element,节点 //type,事件类型 //handler,函数 addHandler:function(element,type,handler ...
- JavaScript的事件监听、捕获和冒泡
在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调函数来进行相关的操作. 而JavaScript中事件监听的方法总共有三种,分别如下: element. ...
- js事件监听-addEventListener (w3c标准) 和 attachEvent(ie)
研究了一个小时,没看懂这两个属性 window.onload = function(){ var oDiv = document.getElementById("J_myDiv") ...
随机推荐
- java中采用dom4j解析xml文件
一.前言 在最近的开发中用到了dom4j来解析xml文件,以前听说过来解析xml文件的几种标准方式:但是从来的没有应用过来,所以可以在google中搜索dmo4j解析xml文件的方式,学习一下dom4 ...
- RecyclerView item 状态错乱
adapter中: private List<Integer> checkboxUserIdList = new ArrayList<>(); 在如下这个方法中: public ...
- Json.Net的简单使用
1.添加程序集 Newtonsoft.Json.dll 2.创建模型 public class Person { public string Name { get; set; } public ...
- Jquery事件:鼠标移入移出(mouseenter,mouseleave)
前几天帮朋友做了一个单页面,其中有个效果就是鼠标移动到头像上变换头像样式,当鼠标移出时恢复头像样式.当时没多想,脑子就蹦出了mouseover,mouseout两个方法. 但是在编写页面的过程中,无论 ...
- [IOS]译Size Classes with Xcode 6: One Storyboard for all Sizes
Size Classes with Xcode 6: One Storyboard for all Sizes 为所有的尺寸准备一个Storyboard 我最喜欢的Xcode6的特性是新的size c ...
- 不安装Oracle客户端使用PLSQL连接Oracle数据库的方法
1,下载PL\SQL http://dl8.cr173.com/soft1/PLSQLDeveloper10_ha.zip(这个是我下载的,带破解和汉化); 2,下载完后傻瓜式安装 ,这里说下,1是P ...
- 解决echsop兼容jquery(transport.js的冲突)的问题
方案一: 本人亲测过,可以用.有的人说需要删除js目录下的gobal.js文件,否则依然会冲突.我没删除也解决了冲突. 1.加入JSON2.js文件 原因很简单,transport修改Object是为 ...
- PHP基础知识之数组
数组的定义: array( key => value , ... ) // 键(key)可以是一个整数或字符串,键可以省略,默认从0开始索引 // 值(value)可以是任意类型的值或者简写的方 ...
- Linux用过的命令
-上传sudo -u b2b rz--创建文件夹sudo -u b2b mkdir--copysudo -u b2b cp /b2b/apache-tomcat-7.0.64/matt/DqN017S ...
- java、Android SDK、adb环境变量配置,以及JDK1.7换JDK1.8
最近因项目需要使用将JDK1.7换成JDK1.8,故重新清晰地记录各种环境变量的配置: 这里更改的均是系统变量,不是用户变量 java环境变量配置: 变量名 变量值JAVA ...