(function () {
// 兼容的事件助手
window.CompatibleEventHelper = {
addEventListener: function (elem, type, cb) {
if (elem.addEventListener) {
elem.addEventListener(type, cb, false);
}
else if (elem.attachEvent) {
elem.attachEvent('on' + type, cb);
}
else {
elem['on' + type] = cb;
}
},
removeEventListener: function (elem, type, cb) {
if (elem.removeEventListener) {
elem.removeEventListener(type, cb, false);
}
else if (elem.detachEvent) {
elem.detachEvent('on' + type, cb);
}
else {
elem['on' + type] = null;
}
},
getEvent: function (event) {
return event || window.event;
},
getTarget: function (event) {
event = this.getEvent(event);
return event.target || event.srcElement;
},
preventDefault: function (event) {
event = this.getEvent(event);
if (event.preventDefault) {
event.preventDefault();
}
else {
event.returnValue = false;
}
},
stopPropagation: function (event) {
event = this.getEvent(event);
if (event.stopPropagation) {
event.stopPropagation();
}
else {
event.cancelBubble = true;
}
}
};
})(); /*
范例:
html:
<div id="box">box</div> js:
var box = document.getElementById('box');
CompatibleEventHelper.addEventListener(box, 'click', function (event) {
// do something...
});
*/

JS - 兼容的事件助手的更多相关文章

  1. [转]FireFox与IE 下js兼容触发click事件的代码

    本文转自:http://www.jb51.net/article/16549.htm FireFox与IE 下js兼容触发click事件 ,对于需要兼容这两者的朋友,就需要参考下下面的代码了<a ...

  2. css js 兼容问题

    js  兼容问题 1. document.form.item 问题问题:代码中存在 document.formName.item("itemName") 这样的语句,不能在FF下运 ...

  3. js中添加事件 attachEvent 与 addEventListener

    给元素添加事件时,使用js进行实现时产生了疑惑,有关事件浏览器兼容的问题,在此记录如下. <!DOCTYPE html> <html> <head> <met ...

  4. DOM 以及JS中的事件

    [DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...

  5. 从零开始的JS生活(二)——BOM、DOM与JS中的事件

    上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举 ...

  6. JS中的事件以及DOM 操作

    [DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...

  7. JS中的事件&对象

    一.JS中的事件 (一)JS中的事件分类 1.鼠标事件 click/dblclick/onmouseover/onmouseout 2.HTML事件 onload/onscroll/onsubmit/ ...

  8. JS学习五(js中的事件)

    [JS中的事件分类] 1.鼠标事件 click/bdlclick/onmouseover/onmouseout 2. HTML事件 onload/onscroll/onsubmit/onchange/ ...

  9. JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象

       前   言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...

随机推荐

  1. js实现的省市县三级联动的最新源码

    <!DOCTYPE html> <html> <head> <title>省市区三级联动</title> <!-- 直接使用QQ的省市 ...

  2. 修改model,映射到表中

    1. 当使用EF code first创建数据表后,数据库中会自动创建一个名为:dbo.__MigrationHistory的系统数据表, 如果尚未启用数据库迁移功能,那么每次在应用程序运行时,都会对 ...

  3. webpack.config.js====图片处理

    1. 安装依赖: cnpm install --save-dev url-loader image-webpack-loader html-loader 2. webpack.config.js规则的 ...

  4. 你真的了解 advice, joinpoint,pointcut,aspect吗?

    假设我们有一个很普通的Employee类,在某些方法被调用时,这个类里的方法也被调用. class Employee{ public String getName(int id){....} priv ...

  5. EF Core 2.1 +数据库视图

    1.参考文档 https://stackoverflow.com/questions/36012616/working-with-sql-views-in-entity-framework-core ...

  6. JavaScript精简代码 非一般的写法(转载)

    摘要:最近在编写一个前端模块功能,编写了大量的代码,其中一般图片特效展示是参考别人的代码来写的,发现有些代码似乎看得明白又好像不确定是不是哪个意思,所以在网上问了一下程序员们,原来是JS代码简写. 转 ...

  7. 回归JDK源代码(2)Enumeration<E>接口

    现在的Java程序员习惯使用Iterator<E>接口或者增强for循环来遍历集合.如果回到JDK 1.0,Enumeration接口则是遍历向量.哈希表的不二之选.本节就解读和翻译一下E ...

  8. Quartz .Net(定时框架):

    Quartz .Net(定时框架): 基本说明: 说明:Quartz .Net 是一个从 Java 版的 Quartz 移植过来定时任务框架,可以实现异常灵活的定 时任务 用法: 安装 Quartz ...

  9. SAP ECC6.0-中建信息版

    平台: SUSE Enterprise Server 类型: 虚拟机镜像 软件包: sap ecc 6.0 ehp7 sps10 commercial erp sap 服务优惠价: 按服务商许可协议 ...

  10. jshint-eclipse: JavaScript Code Quality Plugin for Eclipse

    https://blog.oio.de/2012/03/26/jshint-eclipse-javascript-code-quality-plugin-for-eclipse/   techscou ...