公共事件处理函数js库
var EventUtil = {
/*
*添加事件处理 参数:元素对象 事件类型 处理函数
*/
addHandle: function (element, type, handle) {
//dom2级的事件添加
if (element.addEventListener) {
element.addEventListener(type, handle, false);
} else {
//IE 的事件添加
if (element.attachEvent) {
element.attachEvent('on' + type, handle);
} else {
//给元素特性赋值
element['on' + type] = handle;
}
}
},
/*
*移除事件处理 参数:元素对象 事件类型 处理函数
*/
removeHandle: function (element, type, handle) {
//dom2级的事件移除
if (element.removeEventListener) {
element.removeEventListener(type, handle, false);
} else {
//IE的事件移除
if (element.detachEvent) {
element.detachEvent('on' + type, handle);
} else {
//给元素特性赋值为空对象以移除事件
element['on' + type] = null;
}
}
},
//获得event对象 IE中以参数event对象传入 Dom中通过window.event来访问
getEvent: function (event) {
return event ? event : window.event;
},
//获得事件的目标 dom中通过event.target获得 IE中通过event.srcElement
getTarget: function (event) {
return event.target || event.srcElement;
},
//取消事件的默认行为
preventDefault: function (event) {
if (event.preventDefault) {
//Dom 方法
event.preventDefault();
} else {
//设置IE event.returnValue = false
event.returnValue = false;
}
},
//停止事件冒泡
stopPropagation: function (event) {
//Dom 方法
if (event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;;
}
},
//获得相关目标对象
getRelatedTarget: function (event) {
//Dom 方法 relatedTarget只对mouseover和mouseout事件才包含值 否则 这个值为null
if (event.relatedTarget) {
return event.relatedTarget;
} else {
//IE
if (event.toElement) {
return event.toElement;
} else {
if (event.fromElement) {
return event.fromElement;
} else {
return null;
}
}
}
},
//获得鼠标按键 0表示左键 1表示中间轮 2表示右键
getButton: function (event) {
//是否支持Dom鼠标事件
if (document.implementation.hasFeature('MouseEvents', '2.0')) {
return event.button;
} else {
switch (event.button) {
case 0:
case 1:
case 3:
case 5:
case 7:
return 0;
case 2:
case 6:
return 2;
case 4: return 1;
}
}
},
//获得字符编码
getCharCode: function (event) {
if (typeof event.charCode == 'number') {
return event.charCode;
} else {
return event.keyCode;
}
}
};
公共事件处理函数js库的更多相关文章
- js中关于事件处理函数名后面是否带括号的问题
今天总结一个关于事件处理程序的小细节.首先回顾一下事件处理的一些概念. JS中的事件处理(事件绑定)就是让某种或某些事件触发某些活动.有两种常见的形式,分别是DOM Level 0 和DOM Leve ...
- JS绑定事件处理函数及处理流程
一.事件绑定的几种方式: 1.1 ele.on+“事件名“:如div.onclick = function(event){ }; 1.1.1这种方式兼容性非常好,但一个元素的同一个事件上只能绑定一个处 ...
- js跨浏览器的事件处理函数
/* 跨浏览器的事件处理函数 */ var EventUtil = { addHandler : function(element,type,handler){ if(element.addEvent ...
- js 中用Dom2级事件处理函数(改变样式)
下面这些客户端 javascript代码用到了事件,它给一个很重要的事件--“load" 事件注册了一个事件处理程序.同时展示了注册”click“事件处理函数更高级的一种方法 <!do ...
- js中绑定事件处理函数,使用event以及传递额外数据
IE8中使用attachEvent绑定事件处理函数时,不能直接向event 对象添加数据属性.可以用属性复制的方法,包装新的event对象. 1. 属性复制var ObjectExtend = fun ...
- 仿照jquery封装一个自己的js库(一)
所谓造轮子的好处就是复习知识点,加深对原版jquery的理解. 本文系笔者学习jquery的笔记,记述一个名为"dQuery"的初级版和缩水版jquery库的实现.主要涉及知识点包 ...
- jQuery总结--版本二 事件处理函数
一:事件处理函数 (1) one(事件名称, fn) 仅对指定事件监听一次,监听事件只会执行一次 <!DOCTYPE html> <html> <head lang=&q ...
- 解决同一页面jQuery多个版本或和其他js库冲突方法
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...
- 前端之Vue.js库的使用
vue.js简介 Vue.js读音 /vjuː/, 类似于 view Vue.js是前端三大新框架:Angular.js.React.js.Vue.js之一,Vue.js目前的使用和关注程度在三大框架 ...
随机推荐
- 基于FPGA的通信信号源的设计
通信信号源设计原理 通过设计一个DDS信号源,然后将该信号作为载波信号,再对基带信号进行2ASK.2FSK.2PSK.2DPSK调制,进而产生多种通信信号. 设计框图如下: 将PN序列进行2ASK.2 ...
- canvas拖动
var canvas=document.getElementById("canvas"); var cxt=canvas.getContext("2d"); v ...
- 各种图(流程图,思维导图,UML,拓扑图,ER图)简介
来源于:http://www.cnblogs.com/jiqing9006/p/3344221.html 流程图 1.定义:流程图是对过程.算法.流程的一种图像表示,在技术设计.交流及商业简报等领域有 ...
- [转]java.lang.OutOfMemoryError: PermGen space及其解决方法
原文地址:http://peak.iteye.com/blog/52606 这个问题是我的工程中加入了Birt报表在Linux环境下运行出现的问题,从网上搜索了一下看到这文章发现并不是由于Birt的原 ...
- iOS开发中的错误整理,IOS9中canOpenURL调用失败分析
由于IOS加入对用户隐私以及禁止扫描系统信息的控制,目前通过canOpenURL的方法来判断用户是否安装特定app,则会出现-canOpenURL: failed for URL: "ABC ...
- 【BZOJ 3529】【SDOI 2014】数表
看Yveh的题解,这道题卡了好长时间,一直不明白为什么要······算了当时太naive我现在都不好意思说了 #include<cstdio> #include<cstring> ...
- 同 一个页面,不同请求路径,如何根据实际场景写JS
场景:使用同一个“添加群成员”的页面来操作 建群页面:建群成功后,返回查看群成员页面.在建群过程中直接添加群成员并返回一个群名称的参数. 添加群成员页面:在巳有群内添加群成员,添加成功后,返回查看群成 ...
- nginx正向代理,反向代理,透明代理(总结)
1正向代理 正向代理,也就是传说中的代理,他的工作原理就像一个跳板, 简单的说, 我是一个用户,我访问不了某网站,但是我能访问一个代理服务器 这个代理服务器呢,他能访问那个我不能访问的网站 于是我先连 ...
- java的debug和release编译方式
以前没有注意过,其实Java编译成.class 有两种方式 使用javac,默认使用的release方式,而我们经常使用的MyEclipse工具,用的是debug模式. 区别暂时了解如下: relea ...
- 关于API认证的问题
问题:如何保证api安全?-->做api的认证 如下图 整个过程大概就是这样. 好像没什么可以讲的....