Everyone uses event monitoring in js a lot. It is just to determine whether the browser supports addEventListener and attachEvent. There are many methods of event monitoring found online, but some of them are not perfect. The method below is the same for adding event listeners, except that some operations have been performed on canceling event binding. Now it can support the use of anonymous functions, so there is no need to name the function separately when binding events. .
Main code:
/*Binding events and unbinding*/
var handleHash = {};
var bind = (function() {
if (window.addEventListener) {
return function( el, type, fn, capture) {
el.addEventListener(type, function(){
fn();
handleHash[type] = handleHash[type] || [];
handleHash [type].push(arguments.callee);
}, capture);
};
} else if (window.attachEvent) {
return function(el, type, fn, capture) {
el.attachEvent("on" type, function(){
fn();
handleHash[type] = handleHash[type] || [];
handleHash[type].push (arguments.callee);
});
};
}
})();
var unbind = (function(){
if (window.addEventListener) {
return function(el, type) {
if(handleHash[type]){
var i = 0, len = handleHash[type].length;
for (i; i el.removeEventListener(type, handleHash[type][i]);
}
};
};
} else if (window.attachEvent) {
return function(el, type) {
if(handleHash[type]){
var i = 0, len = handleHash[type].length;
for (i; i el.detachEvent("on" type, handleHash[type][i]);
}
};
};
}
})() ;
Principle analysis:
handleHash functions as a hash table cache event. handleHash['event name'] is an array to add multiple event listening methods. When unbinding which event, traverse the array of handleHash['event name'], and then Remove.
Use:
bind (obj,'click',function(){
alert ('click');
});
unbind(obj,'click');
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
