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) {//获取event对象,返回event对象的引用
return event ? event : window.event;
},
getTarget: 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;
}
},
getRelatedTarget: function(event){//返回相关元素信息(仅对于mouseover和mouseout事件)
if (event.relatedTarget){
return event.relatedTarget;
} else if (event.toElement){
return event.toElement;
} else if (event.fromElement){
return event.fromElement;
} else {
return null;
}
},
getWheelDelta: function(event) {//获取鼠标滚轮增量值,检测是否包含WheelDelta
if(event.wheelDelta) {
return event.wheelDelta;
}else {
return -event.detail * 40
}
},
getCharCode: function(event) {//获取键盘按键键码。
if(typeof event.charCode == 'number') {
return event.charCode;
}else {
return event.keyCode;
}
},
getButton:function(event){//在mouseup或者mousedown的时候,event存在一个button属性,用于判断是按了鼠标左键,右键,还是中键,0鼠标主键按钮,1是中间,2是次键(右键)
if(document.implementation.hasFeature("MouseEvents","2.0")){
return event.button;
}else{
switch(event.button){
case 0:
case 1:
case 3:
case 5:
case 7:
return 0;
case 2:
case 6:
return 2;
case 4:
return 1; }
} }
};

封装常用的跨浏览器的事件对象EventUtil的更多相关文章

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

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

  2. 跨浏览器的事件对象EventUtil

    var EventUtil = function(){ /*--addHandler--*/ addHandler:function(element,type,handler){ if(element ...

  3. js事件对象--DOM中的事件对象/IE中的事件对象/跨浏览器的事件对象

    事件对象    在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息.包括导致事件的元素.事件的类型,以及其他与特定事件相关的信息.例如,鼠标操作导致的事件对 ...

  4. Javascript跨浏览器的事件对象

    一.跨浏览器的事件对象 var EventUtil = { ///添加事件 addHandler: function (element, type, handler) { if (element.ad ...

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

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

  6. javaScript之跨浏览器的事件对象

    跨浏览器的兼容代码 var eventHandler = { addHandler: function(element, type, handler){}, removeHandler: functi ...

  7. js实现一些跨浏览器的事件方法

    用JavaScript实现事件的绑定,移除,以及一些常用的事件属性的获取,时常要考虑到在不同浏览器下的兼容性,下面给出了一个跨浏览器的事件对象: var EventUtil = { on: funct ...

  8. JavaScript跨浏览器绑定事件函数的优化

    JavaScript作为一门基于事件驱动的语言(特别是用在DOM操作的时候),我们常常需要为DOM绑定各种各样的事件.然而,由于低版本的IE的不给力,在绑定事件和移除事件监听上都与众不同,我们常常需要 ...

  9. js 跨浏览器实现事件

    我们知道不同的浏览器实现事件是不同的,就比如说我们常见的有三种方法: 1,dom0处理事件的方法,以前的js处理事件都是这样写的. (function () { var p=document.getE ...

随机推荐

  1. typescript多维对象数组仿List泛型

    定义对象: namespace entity{ export class MyClass{ public value:number; public rect:string; public constr ...

  2. 1:C#的三种异步的详细介绍及实现

    一.介绍异步的前世今生: 异步编程模型 (APM,Asynchronous Programming Model) 模式(也称 IAsyncResult 模式),在此模式中异步操作需要 Begin 和 ...

  3. tomcat异常 Socket bind failed: [730048]

    tomcat从官网站点下载时须注意版本信息: zip格式为window压缩版. tar.gz为linux安装板. installer为window安装板. 解压后的各文件功能与作用: bin:用于放置 ...

  4. jquery call cross-domain webapi owin self-host

    <!DOCTYPE HTML> <html LANG="cn"> <head> <meta name="viewport&quo ...

  5. ocp题库更新,052最新考试题及答案整理-31

    31.Which two events always request the LGWR to write? A) when LGWR is notified by a server process t ...

  6. redis在Linux上的部署和jedis简单使用

    一.redis的安装 这里演示的版本是Redis4.0.6,Linux系统是CentOS6.7,Jdk1.7,Jedis2.8.1 这是官方文档介绍的安装方式 下载,解压,编译: $ wget htt ...

  7. dos 下脚本编写须知

    主题为:doc脚本运行结束后,不自动退出终端. 方法1假设你的bat名字叫rabbit.bat你可以新开一个bat,内容是start rabbit.bat然后这个新的bat是不会自动关闭的 注意,这个 ...

  8. php 的加法

    无意间看到了php中关于加,减,乘,除 的计算方法 这里 http://lxr.php.net/source/xref/PHP-5.6/Zend/zend_operators.h#596 static ...

  9. opencv学习笔记(七)---图像金字塔

    图像金字塔指的是同一图像不同分辨率的子图的集合,有向下取样金字塔,向上取样金字塔,拉普拉斯金字塔....它是图像多尺度表达的一种,最主要的是用于图像的分割 向下取样金字塔指高分辨率图像向低分辨率图像的 ...

  10. 使用bootstrap-table等自动使用ajax地址载入数据的插件的数据设计建议

    提出问题: bootstrap-table 可以根据ajax地址load的json数据.这个json数据一般就是数据库中查询的结果,而数据库中存放的数据一般不是用户友好的,比如数据表示一般使用简洁id ...