(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. vue学习笔记 vue

    目前为止对vue完全懵逼. 对着菜鸟教程,现在我尝试梳理下. 服务我已经启起来.可以看到页面 在src/App.vue里面有展示模板<template></template> ...

  2. vue将数据绑定到属性中

    *必须使用[] <tr v-for="(p,index) in prodects"> @*v-bind:class="styleType(index)&quo ...

  3. hystrix应用介绍(三)

    hystrix提供了两种隔离策略:线程池隔离和信号量隔离.hystrix默认采用线程池隔离. 1.线程池隔离 不同服务通过使用不同线程池,彼此间将不受影响,达到隔离效果. 例如: 我们可以通过andT ...

  4. Python基本操作之文件操作

    一. 1.文件操作的函数 open("文件名字(路径)",mode="模式",encoding="字符集") 2.模式:r,w,a,r+,w ...

  5. HTML标签_1

    <meta charset="utf-8" /> 设置字符集 <meta name="description" content="这 ...

  6. thinkphp中怎么判断是手机端访问还是pc端访问?

    function isMobile() { // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset ($_SERVER['HTTP_X_WAP_PROFILE'])) r ...

  7. canvas制作倒计时炫丽效果

    <!DOCTYPE html> <head> <title>canvas倒计时</title> <style> .canvas{ displ ...

  8. StackTrack for debug

    System.Diagnostics.Debug.WriteLine("Serial port. {0},{1}", this.GetType().FullName, new Sy ...

  9. view 状态动画

    stateListAnimator 一.xml配置 方法 res/xml/animate_scale.xml <?xml version="1.0" encoding=&qu ...

  10. 最小正子序列(序列之和最小,同时满足和值要最小)(数据结构与算法分析——C语言描述第二章习题2.12第二问)

    #include "stdio.h" #include "stdlib.h" #define random(x) (rand()%x) void creat_a ...