javascript 兼容各个浏览器的事件
调用事件:
//事件对象
//什么是事件对象?在触发dom上的事件是都会产生一个事件对象event。例如鼠标点击的时候,自己就会产生比如点击的类型啊 还要那个元素发出的
//dom 事件对象 type 属性用于获取事件对象, target属性 用于获取事件目标,stopPropagation()方法 阻止事件冒泡 preventDefault阻止事件的默认行为
//IE中的事件对象 type 属性 用于获取事件对象, srcElement属性 用于获取事件目标 cancelBubble属性 用于阻止事件冒泡 设置为true是表示阻止 false表示不阻止
//returnValue 属性 用于阻止事件的默认行为 设置为false的时候表示阻止
// 兼容各个浏览器 跨浏览器事件处理------- 统一进行封装
var EventHandle = {
// element : 元素 , type: 点击事件 ,handle : 实行的方法
//添加句柄
addEventHandle: function (element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);//---false //代表冒泡 dom2级
}
else if (element.attachEvent) {
element.attachEvent("on"+type, handler);
} else {
element["on" + type] = handler;
}
},
//删除句柄 事件处理不起作用
removeEventHandle: function (element, type, handler) {
if (element.removeEventListener) { // 支持dom2级的事件处理 type是 onclick
element.removeEventListener(type, handler, false); //---false //代表冒泡
}
else if (element.detachEvent) {
element.detachEvent("on"+type, handler); //支持IE
} else {
element["on" + type] = null;// dom0级事件处理 传统的点击事件
}
},
//获取事件对象 兼容浏览器的所有对象
getEvent: function (event) {
return event ? event : window.event; //在IE浏览器的低版本中需要的是window.event
},
//获取事件类型 是点击呢还是鼠标移动
getType:function(event){
return event.type;
},
//获取当前的那个元素
getElement: function (event) {
return event.target || event.srcElement;
},
//阻止事件的默认行为
: function (event) {
if (event.preventDefault) {
event.preventDefault();
}
else {
event.returnValue = false;
}
},
//阻止事件冒泡
stopPropagation: function (event) {
if (event.stopPropagation) {
event.stopPropagation();
}
else {
event.cancelBubble = true;
}
}
}
javascript 兼容各个浏览器的事件的更多相关文章
- javaScript之跨浏览器的事件对象
跨浏览器的兼容代码 var eventHandler = { addHandler: function(element, type, handler){}, removeHandler: functi ...
- Javascript兼容各浏览器的日期转换
var date = new Date(Date.parse("2015-09-05".replace(/-/g,"/")));'2015-09-05'是无法被 ...
- JavaScript 兼容各大浏览器阻止冒泡事件
JavaScript 兼容各大浏览器阻止冒泡事件 function stopEvent(event) { //阻止冒泡事件 //取消事件冒泡 var e = arguments.callee.call ...
- 在javascript中的浏览器兼容问题以及兼容浏览器汇总(默认事件,阻止冒泡,事件监听。。。)以及解决方式详解
在javascript中常见的浏览器兼容问题,以及解决方式. 在前端工作当中我们遵循这样的原则:渐进增强和优雅降级 渐进增强(progressive enhancement): 针对低版本浏览器进 ...
- JavaScript和JQuery中的事件\委托链\事件冒泡\事件捕获,兼容所有浏览器
有做过北大青鸟培训讲师经验的我,如今在一家公司做技术部经理的职位,发现有很多程序员的基本功相当糟糕,在组织企业内部培训时讲解了一些案例,总结了一些经典代码,希望对自己和有需要的人提供一些帮助吧: Ja ...
- JavaScript单线程和浏览器事件循环简述
JavaScript单线程 在上篇博客<Promise的前世今生和妙用技巧>的开篇中,我们曾简述了JavaScript的单线程机制和浏览器的事件模型.应很多网友的回复,在这篇文章中将继续展 ...
- JS获取回车事件(兼容各浏览器)
一.用到onkeydown获取事件动作, 二.用到键盘对应代码keyCode, 三. var event=arguments.callee.caller.arguments[0]||window.ev ...
- JavaScript 图片的上传前预览(兼容所有浏览器)
功能描述 通过 JavaScript 实现图片的本地预览(无需上传至服务器),兼容所有浏览器(IE6&IE6+.Chrome.Firefox). 实现要点 ● 对于 Chrome.Fire ...
- js捕捉浏览器关闭事件-兼容几乎所有浏览器
很多时候我们都在困扰,如何捕获浏览器关闭事件,网上虽然有很多方法,但都不理想,后来终于找到了一个很好地实现方法,大家可以试试哦,支持几乎所有的浏览器 <script type="tex ...
随机推荐
- 数据连接池——JNDI
数据库连接有很多中方式,JDBC数据库的连接方式,前边我们已经介绍过了,而开发中我们经常使用的是DataBaseConnectionPool(数据库连接池,DBCP).数据库连接池到底是什么?它比jd ...
- Oracle基础学习5-- Oracle权限之”角色”
不论什么与权限相关的东西都少不了"角色"的概念,Java如此,.Net如此,Oracle当然也不例外. 角色事实上就是权限的集合,将多个权限打包到一个角色中,这样每一个角色有特定的 ...
- MFC多线程内存泄漏问题&解决方法
在用visual studio进行界面编程时(如MFC),前台UI我们能够通过MFC的消息循环机制实现.而对于后台的数据处理.我们可能会用到多线程来处理. 那么对于大多数人(尤其是我这样的菜鸟),一个 ...
- Android Native/Tombstone Crash Log 详细分析(转)
转自:http://weibo.com/p/230418702c2db50102vc2h Android 虽然已经有好几年了,但是NDK的开放速度却非常缓慢,所以目前网络上针对对Android Nat ...
- 使用AsyncTask实现图片加载
如上图所示:我们看到的就是使用PrograssDialog进度条和AsyncTask异步任务实现的效果(额,不要看应用名...).下面介绍一下具体的实现流程. 一.首先使用XML布局,布局很简单直接上 ...
- Emmet 语法探析
Emmet 语法探析 Emmet(Zen Coding)是一个能大幅度提高前端开发效率的一个工具. 大多数编辑器都支持Snippet,即存储和重用一些代码块.但是前提是:你必须先定义 这些代码块. E ...
- 新博客 Fighting
C3 Viso绘图 的 几种关系
- Oracle学习之常见错误整理
一.ORA-12154: TNS: 无法解析指定的连接标识符 在程序中连接Oracle数据库的方式与其他常用数据库,如:MySql,Sql Server不同,这些数据库可以通过直接指定IP的方式连接, ...
- FireDAC
http://docs.embarcadero.com/products/rad_studio/firedac/frames.html Access: http://docwiki.embarcade ...
- 串口调试工具(Python2.7+pyserial+Tkinter)
需要与串口设备进行通讯,那么一个调试工具是必须的. 根据我自己的需要,写了个简易版本的串口调试工具: 预览图: ====================== 项目结构: COM --SerialHel ...