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 ...
随机推荐
- js获取浏览器的keydown事件(附keycode码)
<script type="text/javascript" language=JavaScript charset="UTF-8"> docume ...
- More is better(并差集)
More is better Time Limit : 5000/1000ms (Java/Other) Memory Limit : 327680/102400K (Java/Other) To ...
- Splay POJ3468(老题新做)
A Simple Problem with Integers Time Limit:5000MS Memory Limit:131072KB 64bit IO Format:%I64d ...
- ubuntu下安装xlrd模块,Mysqldb模块
Python中安装xlrd模块 1.从 https://pypi.python.org/pypi/xlrd 下载压缩包 2.解压所下载的压缩包 3.CD到解压文件夹,运行 sudo python s ...
- hdu2095 像水题的不错题 异或运算
异或运算的基础有点忘记了 先介绍一下..2个数异或 就是对于每一个二进制位进行位运算 具有2个特殊的性质 1.一个数异或本身恒等于0,如5^5恒等于0: 2.一个数异或0恒等于本身,如5^0恒等于5. ...
- A child container failed during start 解决方案
症状:A child container failed during start 适用问题描述:tomcat挂空可以正常运行,载入项目时挂掉. 相关操作:之前为了省事,由于两个servlet功能类似所 ...
- iOS中json解析出现的null,nil,NSNumber的问题
在iOS开发过程中经常需要与服务器进行数据通讯,Json就是一种常用的高效简洁的数据格式. 问题现象 但是几个项目下来一直遇到一个坑爹的问题,程序在获取某些数据之后莫名崩溃.其实很早就发现了原因:由于 ...
- (转载) socket:10038错误{winSock的一个bug:当closesocket多次错误使用时会导致问题}
这几天想在一个开源的代码上进行修改,以期研发出一个产品出来. 程序原来是单线程网络程序,需要修改为多线程,修改之后,总是出问题,辅助线程中的recv函数总是运行一阵子之后收到长度为-1的数 ...
- 【Lucene4.8教程之一】使用Lucene4.8进行索引及搜索的基本操作
在Lucene对文本进行处理的过程中,可以大致分为三大部分: 1.索引文件:提取文档内容并分析,生成索引 2.搜索内容:搜索索引内容,根据搜索关键字得出搜索结果 3.分析内容:对搜索词汇进行分析,生成 ...
- Hibernate注解学习1
由于项目的原因目前需要一些简单注解,于是就做了个hibernate注解的小demo,来记录一下. 1.需要引入jar包ejb3-persistence.jarhibernate-annotations ...