EventUtil处理js兼容性问题
var EventUtil={
addHandler:function(element,type,handler){ //添加事件
if(element.addEventListener){
element.addEventListener(type,handler,false); //使用DOM2级方法添加事件
}else if(element.attachEvent){ //使用IE方法添加事件
element.attachEvent("on"+type,handler);
}else{
element["on"+type]=handler; //使用DOM0级方法添加事件
}
},
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对象
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){ //立即停止事件在DOM中的传播
//避免触发注册在document.body上面的事件处理程序
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble=true;
}
},
getRelatedTarget:function(event){ //获取mouseover和mouseout相关元素
if(event.relatedTarget){
return event.relatedTarget;
}else if(event.toElement){ //兼容IE8-
return event.toElement;
}else if(event.formElement){
return event.formElement;
}else{
return null;
}
},
getButton:function(event){ //获取mousedown或mouseup按下或释放的按钮是鼠标中的哪一个
if(document.implementation.hasFeature("MouseEvents","2.0")){
return event.button;
}else{
switch(event.button){ //将IE模型下的button属性映射为DOM模型下的button属性
case 0:
case 1:
case 3:
case 5:
case 7:
return 0; //按下的是鼠标主按钮(一般是左键)
case 2:
case 6:
return 2; //按下的是中间的鼠标按钮
case 4:
return 1; //鼠标次按钮(一般是右键)
}
}
},
getWheelDelta:function(event){ //获取表示鼠标滚轮滚动方向的数值
if(event.wheelDelta){
return event.wheelDelta;
}else{
return -event.detail*40;
}
},
getCharCode:function(event){ //以跨浏览器取得相同的字符编码,需在keypress事件中使用
if(typeof event.charCode=="number"){
return event.charCode;
}else{
return event.keyCode;
}
}
};
注意:
1、IE的attachEvent()与addEventLisener()添加的匿名函数是无法移除的。
2、attachEvent() 与 DOM0级的方法,主要区别:事件处理程序作用域:attachEvent()会在全局作用域;DOM0 作用域会在其所属元素。
EventUtil处理js兼容性问题的更多相关文章
- IE 和Firefox的js兼容性总结
IE 和Firefox的js兼容性总结 12 August 2010 11:39 Thursday by 小屋 标签: 浏览器 方法 属性 IT 写法 一.函数和方法差异 1 . getYear()方 ...
- webpack 之js兼容性处理
webpack 之js兼容性处理 // 用来拼接绝对路径的方法 const {resolve} = require('path') const HtmlWebpackPlugin = require( ...
- js兼容性问题总结
JS中出现的兼容性问题的总结1.关于获取行外样式 currentStyle 和 getComputedStyle 出现的兼容性问题 我们都知道js通过style不可以获取行外样式,当我们需要获取行外 ...
- js兼容性记录
做BS开发就难免会用到javascript,而每个浏览器对javascript的支持有不同.这就需要我们程序员去兼容他们,不然有些浏览器就无法运行我们的代码.就会造来客户的投诉,如果让BoSS知道了, ...
- ff与ie 的关于js兼容性
FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的.但它主要检查FF方面的错误,对IE就无能为力了.要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不到测 ...
- JS兼容性问题列表
记录平时遇见的兼容性问题,有更好的解决办法希望各位提出,会随着开发遇到问题而更新,标记为黄色的为未解决和猜测答案 提出时间 问题描述 解决方案 2014/10/22 submit按钮阻止了默认事件不能 ...
- js兼容性大全
js有个第二定律好的属性/选择器一定不兼容/* 获取类名通用代码*/function getClassName(){ if(document.getElementsByClassName){ doso ...
- js兼容性问题
javscript 浏览器兼容性问题: scrollTop = document.documentElement.scrollTop || document.body.scrollTop; scrol ...
- JS兼容性问题(FF与IE)
不同浏览器中js兼容问题大全 1.document.formName.item('itemName')问题 说明: //IE下(两种) document.formName.item("ite ...
随机推荐
- Asp.net中的ViewState用法
Session,ViewState用法基本理论:session值是保存在服务器内存上,那么,可以肯定,大量的使用session将导致服务器负担加重. 而viewstate由于只是将数据存入到页面隐藏控 ...
- X64下IIS调用32位的dll
WebAPI项目中遇到了需要调用32位C++的dll的情况,调试的时候能正常调用,但是发布了之后部署在IIS中出现了BadFormatImage异常, 解决方法是在IIS中相应应用程序池=>高级 ...
- StringMVC返回字符串
@RequestMapping(value="twoB.do") public void twoBCode(HttpServletRequest request,HttpServl ...
- javascript 获取dom书的下一个节点。
利用javascript 写一个在页面点击加减按钮实现数字的累加.. 简略的html大概如此.看得懂就好不要在意这些细节啊 <input type="button" valu ...
- OC与JS交互前言
OC与JS交互过程中,可能会需要使用本地image资源及html,css,js文件,这些资源应该如何被加载? 一.WebView加载HTML UIWebView提供了三个方法来加载html资源 1. ...
- 前端Json数据模拟神器mockJs使用教程
一般项目做法: <html> <head> <script src="http://requirejs.org/docs/release/2.1.16/comm ...
- Eucalyptus常用查询命令
前言: Elastic Utility Computing Architecture for Linking Your Programs To Useful Systems (Eucalyptus) ...
- 搭建zabbix服务器监控
搭建zabbix 监控服务 服务器环境Centos 7.3 修改网卡名称 高并发优化 Web环境 nginx + php-fpm 必须对nginx配置有连接优化 使用systemd服务启动nginx和 ...
- js实现排序去重计算字符次数
/*去重*/ var arr=[1,4,4,7,3,9,0,3,2,1,"你好","你","你好","你 "]; var ...
- 如何处理CloudFoundry应用部署时遇到的254错误
使用SAP云平台的CloudFoundry部署应用: 在cockpit遇到错误信息:instance: a0abe2b5-7623-4cf1-4c65-0c79, index: 0, exit_des ...