原生JS实现跨浏览器的事件处理程序

<!doctype html>
<html lang="en">
<head><meta charset="UTF-8"><title>跨浏览器的事件处理程序</title>
</head>
<body><input type="button" value="click me" id="myBtn"/><input type="button" value="解除" id="unlisten"/><script>function $(id){return document.getElementById(id);}var EventUtil={fnCount:0,fnData:{},addHandler:function(element,type,handler){this.fnCount++;handler.fid = this.fnCount;var _fn = handler;handler = function(){_fn.call(element);};this.fnData[this.fnCount] = handler;if(element.addEventListener){element.addEventListener(type,handler,false);}   else if(element.attachEvent){element.attachEvent("on"+type,handler);}   else {element["on"+type]=handler;}},removeHandler:function(element,type,handler){handler = this.fnData[handler.fid];if(element.removeEventListener){element.removeEventListener(type,handler,false);}else if(element.detachEvent){element.detachEvent("on"+type,handler);}else{element["on"+type]=null;}}}var btn=$("myBtn");var unbtn = $('unlisten');var bindFn1=function(){alert(this.id);};var bindFn2=function(){alert('2');};EventUtil.addHandler(btn,"click",bindFn1);EventUtil.addHandler(btn,"click",bindFn2);//EventUtil.removeHandler(btn,"click",bindFn1);EventUtil.addHandler(unbtn,"click",function(){EventUtil.removeHandler(btn,"click",bindFn1);});</script>
</body>
</html>

原生JS实现跨浏览器的事件处理程序相关推荐

javascript --- DOM0级、DOM2级、跨浏览器的事件处理程序
DOM0级事件处理程序: // 使用DOM0级方法指定的事件处理程序被认为是元素的方法 // 这个时候的事件处理程序是在元素的作用域中运行: <div id = "myBtn" ...
跨浏览器的事件处理程序
我们第一个要创建的方法是addHandler() 它的职责是视情况分别使用DOM0级方法.DOM2级方法或者IE方法来添加事件.这个方法属于一个名叫EventUtil的对象.addHandler() ...
JavaScript --- 跨浏览器的事件处理程序
var EventUtil = {addHandler: function(element, type, handler) { // 添加事件处理程序if (element.addEventListe ...
一些js代码，自己备用的。高手不要笑话我。。（跨浏览器基础事件，浏览器检测，判断浏览器的名称、版本号、操作系统）...
跨浏览器基础事件 View Code 1 //跨浏览器添加事件 2 function addEvent(obj, type, fn) { 3 if (obj.addEventListener) { 4 ...
addevent()实现跨浏览器绑定事件
绑定事件一般有三种方式:传统绑定事件,IE绑定事件,W3C绑定事件.传统绑定存在可读性问题,this问题,覆盖问题.为实现跨浏览器绑定事件,我们采用自定义方法addEvent().代码如下: //跨浏 ...
IFE-16 addEventHandler跨浏览器实现事件绑定
/** * addEventHandler方法 * 跨浏览器实现事件绑定 */ function addEventHandler(ele, event, hanlder) {if (ele.addEv ...
JavaScript --- 跨浏览器的事件对象
var EventUtil={addHandler: function(element, type, handler){ // 添加事件方法if (element.addEventListener){ ...
js html颜色代码,原生js编写的浏览器安全色网页拾色器色盘生成颜色代码
原生js编写的浏览器安全色网页拾色器 by js.alixixi.com #abc-colorPicker .colorPick-close,#filter-colorPicker .colorPic ...
原生js、jq移入移出事件
在原生js上移入移出共有两种一种是冒泡的鼠标移入或移出被选元素及其所有子元素就会触发 element.onmouseover = function(){alert("移入"); ...

原生JS实现跨浏览器的事件处理程序

原生JS实现跨浏览器的事件处理程序相关推荐

最新文章

热门文章