JS - 兼容的事件助手
(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 - 兼容的事件助手的更多相关文章
- [转]FireFox与IE 下js兼容触发click事件的代码
本文转自:http://www.jb51.net/article/16549.htm FireFox与IE 下js兼容触发click事件 ,对于需要兼容这两者的朋友,就需要参考下下面的代码了<a ...
- css js 兼容问题
js 兼容问题 1. document.form.item 问题问题:代码中存在 document.formName.item("itemName") 这样的语句,不能在FF下运 ...
- js中添加事件 attachEvent 与 addEventListener
给元素添加事件时,使用js进行实现时产生了疑惑,有关事件浏览器兼容的问题,在此记录如下. <!DOCTYPE html> <html> <head> <met ...
- DOM 以及JS中的事件
[DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...
- 从零开始的JS生活(二)——BOM、DOM与JS中的事件
上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举 ...
- JS中的事件以及DOM 操作
[DOM树节点] DOM节点分为三大节点:元素节点,文本节点,属性节点. 文本节点,属性节点为元素节点的两个子节点通过getElment系列方法,可以去到元素节点 [查看节点] 1 document. ...
- JS中的事件&对象
一.JS中的事件 (一)JS中的事件分类 1.鼠标事件 click/dblclick/onmouseover/onmouseout 2.HTML事件 onload/onscroll/onsubmit/ ...
- JS学习五(js中的事件)
[JS中的事件分类] 1.鼠标事件 click/bdlclick/onmouseover/onmouseout 2. HTML事件 onload/onscroll/onsubmit/onchange/ ...
- JS基础--函数与BOM、DOM操作、JS中的事件以及内置对象
前 言 絮叨絮叨 这里是JS基础知识集中讲解的第三篇,也是最后一篇,三篇JS的基础,大多是知识的罗列,并没有涉及更难得东西,干货满满!看完这一篇后,相信许多正在像我一样正处于初级阶段的同学, ...
随机推荐
- vue学习笔记 vue
目前为止对vue完全懵逼. 对着菜鸟教程,现在我尝试梳理下. 服务我已经启起来.可以看到页面 在src/App.vue里面有展示模板<template></template> ...
- vue将数据绑定到属性中
*必须使用[] <tr v-for="(p,index) in prodects"> @*v-bind:class="styleType(index)&quo ...
- hystrix应用介绍(三)
hystrix提供了两种隔离策略:线程池隔离和信号量隔离.hystrix默认采用线程池隔离. 1.线程池隔离 不同服务通过使用不同线程池,彼此间将不受影响,达到隔离效果. 例如: 我们可以通过andT ...
- Python基本操作之文件操作
一. 1.文件操作的函数 open("文件名字(路径)",mode="模式",encoding="字符集") 2.模式:r,w,a,r+,w ...
- HTML标签_1
<meta charset="utf-8" /> 设置字符集 <meta name="description" content="这 ...
- thinkphp中怎么判断是手机端访问还是pc端访问?
function isMobile() { // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset ($_SERVER['HTTP_X_WAP_PROFILE'])) r ...
- canvas制作倒计时炫丽效果
<!DOCTYPE html> <head> <title>canvas倒计时</title> <style> .canvas{ displ ...
- StackTrack for debug
System.Diagnostics.Debug.WriteLine("Serial port. {0},{1}", this.GetType().FullName, new Sy ...
- view 状态动画
stateListAnimator 一.xml配置 方法 res/xml/animate_scale.xml <?xml version="1.0" encoding=&qu ...
- 最小正子序列(序列之和最小,同时满足和值要最小)(数据结构与算法分析——C语言描述第二章习题2.12第二问)
#include "stdio.h" #include "stdlib.h" #define random(x) (rand()%x) void creat_a ...