Event Handling Functions - JavaScript Snipplr Social Repository

Revision: 7324

at September 22, 2009 12:08 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others in the
// comments of his article.
//I also added flushEvents() and getTarget(), and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	var undefined;
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else if(element.$$events && element.$$events[type] && handler.$$guid)
		{
			//remove the event handler from the hash table
			delete element.$$events[type][handler.$$guid];
		}
	}
	
	//returns the target of an event (make sure to pass the correct event object)
	function getTarget(event)
	{
		if(!event) return null;
		var target = event.target || event.srcElement || null;
		if(target && target.nodeType == 3) target = target.parentNode;	//it's a text node; defeat Safari bug
		return target;
	};
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue = true;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make sure this item is not an inherited property/method
			if(!Object.prototype[i])
			{
				//make the handler a method of the element so the value of `this` will be correct
				this.$$handler = handlers[i];
				if(this.$$handler(event) === false)
				{
					event.preventDefault();
					returnValue = false;
				}
			}
		}
		//`delete` operator doesn't work for DOM elements in IE
		try{ delete this.$$handler; }
		catch(e){ this.$$handler = undefined; }
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	//removes all event handlers from the DOM that were added using the custom solution
	function flushEvents()
	{
		var elems = document.getElementsByTagName("*");
		for(var i=0; i<elems.length; i++)
		{
			//`delete` operator doesn't work for DOM elements in IE 6 & 7
			try{ delete elems[i].$$events; }
			catch(e){ elems[i].$$events = undefined; }
		}
	}
	
	//***** initialization *****//
	
	//to avoid memory leaks in IE when the page unloads
	if(!window.removeEventListener) addEvent(window, 'unload', flushEvents);
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent,
		getTarget: getTarget,
		getOrigin: getTarget
	};
}();	//initialize Events object

Revision: 7323

at September 22, 2009 12:06 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others in the
// comments of his article.
//I also added flushEvents() and getTarget(), and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	var undefined;
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else if(element.$$events && element.$$events[type] && handler.$$guid)
		{
			//remove the event handler from the hash table
			delete element.$$events[type][handler.$$guid];
		}
	}
	
	//returns the target of an event (make sure to pass the correct event object)
	function getTarget(event)
	{
		if(!event) return null;
		var target = event.target || event.srcElement;
		if(target && target.nodeType == 3) target = target.parentNode;	//it's a text node; defeat Safari bug
		return target;
	};
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue = true;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make sure this item is not an inherited property/method
			if(!Object.prototype[i])
			{
				//make the handler a method of the element so the value of `this` will be correct
				this.$$handler = handlers[i];
				if(this.$$handler(event) === false)
				{
					event.preventDefault();
					returnValue = false;
				}
			}
		}
		//`delete` operator doesn't work for DOM elements in IE
		try{ delete this.$$handler; }
		catch(e){ this.$$handler = undefined; }
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	//removes all event handlers from the DOM that were added using the custom solution
	function flushEvents()
	{
		var elems = document.getElementsByTagName("*");
		for(var i=0; i<elems.length; i++)
		{
			//`delete` operator doesn't work for DOM elements in IE 6 & 7
			try{ delete elems[i].$$events; }
			catch(e){ elems[i].$$events = undefined; }
		}
	}
	
	//***** initialization *****//
	
	//to avoid memory leaks in IE when the page unloads
	if(!window.removeEventListener) addEvent(window, 'unload', flushEvents);
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent,
		getTarget: getTarget,
		getOrigin: getTarget
	};
}();	//initialize Events object

Revision: 7322

at September 22, 2009 11:50 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others in the
// comments of his article.
//I also added flushEvents() and getTarget(), and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	var undefined;
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else if(element.$$events && element.$$events[type] && handler.$$guid)
		{
			//remove the event handler from the hash table
			delete element.$$events[type][handler.$$guid];
		}
	}
	
	//returns the target of an event (make sure to pass the correct event object)
	function getTarget(event)
	{
		if(!event) return null;
		var target = event.target || event.srcElement;
		if(target && target.nodeType == 3) target = target.parentNode;	//it's a text node; defeat Safari bug
		return target;
	};
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue = true;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make sure this item is not an inherited property/method
			if(!Object.prototype[i])
			{
				//make the handler a method of the element so the value of `this` will be correct
				this.$$handler = handlers[i];
				if(this.$$handler(event) === false)
				{
					event.preventDefault();
					returnValue = false;
				}
			}
		}
		//`delete` operator doesn't work for DOM elements in IE
		try{ delete this.$$handler; }
		catch(e){ this.$$handler = undefined; }
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	//removes all event handlers from the DOM that were added using the custom solution
	function flushEvents()
	{
		var elems = document.getElementsByTagName("*");
		for(var i=0; i<elems.length; i++)
		{
			//`delete` operator doesn't work for DOM elements in IE 6 & 7
			try{ delete elems[i].$$events; }
			catch(e){ elems[i].$$events = undefined; }
		}
	}
	
	//***** initialization *****//
	
	//to avoid memory leaks in IE when the page unloads
	if(!window.removeEventListener) addEvent(window, 'unload', flushEvents);
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent,
		getTarget: getTarget
	};
}();	//initialize Events object

Revision: 7321

at September 21, 2009 16:36 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others in the
// comments of his article.
//I also added flushEvents(), changed handleEvent() accordingly, and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else if(element.$$events && element.$$events[type] && handler.$$guid)
		{
			//remove the event handler from the hash table
			delete element.$$events[type][handler.$$guid];
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make sure this item is not an inherited property/method
			if(!Object.prototype[i])
			{
				//make the handler a method of the element so the value of `this` will be correct
				this.$$handleEvent = handlers[i];
				if(this.$$handleEvent(event) === false)
				{
					event.preventDefault();
					returnValue = false;
				}
			}
		}
		this.$$handleEvent = null;
		if(event.type == "unload" && (this===window || this===document.body)) flushEvents();
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	function flushEvents()
	{
		if(!window.removeEventListener)
		{
			var elems = document.getElementsByTagName("*");
			for(var i=0; i<elems.length; i++)
			{
				delete elems[i].$$events;
			}
		}
	}
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == 3) target = target.parentNode;	//it's a text node; defeat Safari bug
	return target;
};

Revision: 7320

at October 7, 2008 15:57 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others.
//I added flushEvents(), changed handleEvent() accordingly, and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		if(event.type == "unload" && (this===window || this===document.body)) flushEvents();
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	function flushEvents()
	{
		if(!window.removeEventListener)
		{
			var elems = document.getElementsByTagName("*");
			for(var i=0; i<elems.length; i++)
			{
				delete elems[i].$$events;
			}
		}
	}
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == 3) target = target.parentNode;	//it's a text node; defeat Safari bug
	return target;
};

Revision: 7319

at October 7, 2008 13:55 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others.
//I added flushEvents(), changed handleEvent() accordingly, and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		if(event.type == "unload" && (this===window || this===document.body)) flushEvents();
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	function flushEvents()
	{
		if(!window.removeEventListener)
		{
			var elems = document.getElementsByTagName("*");
			for(var i=0; i<elems.length; i++)
			{
				delete elems[i].$$events;
			}
		}
	}
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
	return target;
};

Revision: 7318

at October 7, 2008 13:13 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others.
//I added flushEvents(), changed handleEvent() accordingly, and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		if(event.type == "unload" && returnValue !== false && (this===window || this===document.body)) flushEvents();
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	function flushEvents()
	{
		if(!window.removeEventListener)
		{
			var elems = document.getElementsByTagName("*");
			for(var i=0; i<elems.length; i++)
			{
				delete elems[i].$$events;
			}
		}
	}
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
	return target;
};

Revision: 7317

at September 26, 2008 11:49 by wizard04

Updated Code

//This is based almost entirely on Dean Edwards' code, along with modifications suggested by others.
//I added flushEvents(), changed handleEvent() accordingly, and associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		if(event.type == "unload" && (this===window || this===document.body)) flushEvents();
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	function flushEvents()
	{
		if(!window.removeEventListener)
		{
			var elems = document.getElementsByTagName("*");
			for(var i=0; i<elems.length; i++)
			{
				delete elems[i].$$events;
			}
		}
	}
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
	return target;
};

Revision: 7316

at September 26, 2008 10:02 by wizard04

Updated Code

//This is based entirely on Dean Edwards' code, along with modifications suggested by others.
//I associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	function flushEvents()
	{
		if(!window.removeEventListener)
		{
			var elems = document.getElementsByTagName("*");
			for(var i=0; i<elems.length; i++)
			{
				delete elems[i].$$events;
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent,
		flush: flushEvents
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
	return target;
};

Revision: 7315

at September 24, 2008 13:12 by wizard04

Updated Code

//This is based entirely on Dean Edwards' code, along with modifications suggested by others.
//I associated everything with an Events object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	//***** public properties and methods *****//
	
	return {
		add: addEvent,
		remove: removeEvent
	};
}();	//initialize Events

//returns the target of an event (make sure to pass the correct event object)
Events.getTarget = function(event)
{
	if(!event) return null;
	var target = event.target || event.srcElement;
	if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
	return target;
};

Revision: 7314

at September 23, 2008 15:33 by wizard04

Updated Code

//This is based entirely on Dean Edwards' code, along with modifications suggested by others.
//I put everything inside an object.

//written by Dean Edwards, 2005
//with input from Tino Zijdel, Diego Perini, Matthias Miller
//http://dean.edwards.name/weblog/2005/10/add-event/
//http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
//http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	//a counter used to create unique IDs for handlers
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			//assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			//create a hash table of event types for the element
			if(!element.$$events) element.$$events = {};
			//create a hash table of event handlers for each element/event pair
			var handlers = element.$$events[type];
			if(!handlers)
			{
				handlers = element.$$events[type] = {};
				//store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				//assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			//store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			//delete the event handler from the hash table
			if(element.$$events && element.$$events[type])
			{
				delete element.$$events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		//grab the event object (IE uses a global event object)
		//.parentWindow part is for dealing with multiple windows/frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		//get a reference to the hash table of event handlers
		var handlers = this.$$events[event.type];
		//execute each event handler
		for(var i in handlers)
		{
			//make the handler a method of the element so the value of |this| will be correct
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			//the first handler returning false will cancel the remaining handlers for that type of event
			if(returnValue === false) break;
		}
		delete this.$$handleEvent;
		return returnValue;
	}
	
	function fixEvent(event)
	{
		//add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function(){ this.returnValue = false; };
	fixEvent.stopPropagation = function(){ this.cancelBubble = true; };
	
	//returns the target of an event (make sure to pass the correct event object)
	function getTarget(event)
	{
		if(!event) return null;
		var target = event.target || event.srcElement;
		if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
		return target;
	}
	
	//***** public properties and methods *****//
	
	return {
		addEvent: addEvent,
		removeEvent: removeEvent,
		getTarget: getTarget
	};
}();	//initialize Events

Revision: 7313

at September 22, 2008 16:07 by wizard04

Updated Code

// All I did with these is add a couple modifications suggested by others
// and put them in an object; I didn't write them

// written by Dean Edwards, 2005
// with input from Tino Zijdel, Diego Perini, Matthias Miller
// http://dean.edwards.name/weblog/2005/10/add-event/
// http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
// http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
// http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	// a counter used to create unique IDs
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			// assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			// create a hash table of event types for the element
			if(!element.events) element.events = {};
			// create a hash table of event handlers for each element/event pair
			var handlers = element.events[type];
			if(!handlers)
			{
				handlers = element.events[type] = {};
				// store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
				// assign a global event handler to do all the work
				element["on" + type] = handleEvent;
			}
			// store the event handler in the hash table
			handlers[handler.$$guid] = handler;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			// delete the event handler from the hash table
			if(element.events && element.events[type])
			{
				delete element.events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		// grab the event object (IE uses a global event object)
		// .parentWindow part is for dealing with frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		// get a reference to the hash table of event handlers
		var handlers = this.events[event.type];
		// execute each event handler
		for(var i in handlers)
		{
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			// the first handler returning false will cancel the remaining handlers for that type of event
			if (returnValue === false) {
				break;
			}
		}
		return returnValue;
	}
	
	function fixEvent(event)
	{
		// add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function()
	{
		this.returnValue = false;
	};
	fixEvent.stopPropagation = function()
	{
		this.cancelBubble = true;
	};
	
	function getTarget(evt)
	{
		evt = evt || window.event;
		var target = evt.target || evt.srcElement;
		if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
		return target;
	}
	
	//***** public properties and methods *****//
	
	return {
		addEvent: addEvent,
		removeEvent: removeEvent,
		getTarget: getTarget
	};
}();	//initialize Events

Revision: 7312

at July 17, 2008 16:24 by wizard04

Initial Code

// All I did with these is add a couple modifications suggested by others
// and put them in an object; I didn't write them

// written by Dean Edwards, 2005
// with input from Tino Zijdel, Diego Perini, Matthias Miller
// http://dean.edwards.name/weblog/2005/10/add-event/
// http://therealcrisp.xs4all.nl/upload/addEvent_dean.html
// http://dean.edwards.name/weblog/2005/10/add-event2/#comment6264
// http://dean.edwards.name/weblog/2005/10/add-event2/#comment78683

var Events = function()
{
	//***** private properties and methods *****//
	
	addEvent.guid = 1;	// a counter used to create unique IDs
	
	function addEvent(element, type, handler)
	{
		if(element.addEventListener)
		{
			element.addEventListener(type, handler, false);
		}
		else
		{
			// assign each event handler a unique ID
			if(!handler.$$guid) handler.$$guid = addEvent.guid++;
			// create a hash table of event types for the element
			if(!element.events) element.events = {};
			// create a hash table of event handlers for each element/event pair
			var handlers = element.events[type];
			if(!handlers)
			{
				handlers = element.events[type] = {};
				// store the existing event handler (if there is one)
				if(element["on" + type])
				{
					handlers[0] = element["on" + type];
				}
			}
			// store the event handler in the hash table
			handlers[handler.$$guid] = handler;
			// assign a global event handler to do all the work
			element["on" + type] = handleEvent;
		}
	}
	
	function removeEvent(element, type, handler)
	{
		if(element.removeEventListener)
		{
			element.removeEventListener(type, handler, false);
		}
		else
		{
			// delete the event handler from the hash table
			if(element.events && element.events[type])
			{
				delete element.events[type][handler.$$guid];
			}
		}
	}
	
	//***helper functions***//
	
	function handleEvent(event)
	{
		var returnValue;
		// grab the event object (IE uses a global event object)
		// .parentWindow part is for dealing with frames in IE
		event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
		// get a reference to the hash table of event handlers
		var handlers = this.events[event.type];
		// execute each event handler
		for(var i in handlers)
		{
			this.$$handleEvent = handlers[i];
			returnValue = this.$$handleEvent(event);
			// the first handler returning false will cancel the remaining handlers for that type of event
			if (returnValue === false) {
				break;
			}
		}
		return returnValue;
	}
	
	function fixEvent(event)
	{
		// add W3C standard event methods
		event.preventDefault = fixEvent.preventDefault;
		event.stopPropagation = fixEvent.stopPropagation;
		return event;
	}
	fixEvent.preventDefault = function()
	{
		this.returnValue = false;
	};
	fixEvent.stopPropagation = function()
	{
		this.cancelBubble = true;
	};
	
	function getTarget(evt)
	{
		evt = evt || window.event;
		var target = evt.target || evt.srcElement;
		if(target && target.nodeType == NT_TEXT) target = target.parentNode;	//defeat Safari bug
		return target;
	}
	
	//***** public properties and methods *****//
	
	return {
		addEvent: addEvent,
		removeEvent: removeEvent,
		getTarget: getTarget
	};
}();	//initialize Events

Initial URL

Initial Description

`Events.add(element, type, handler)` adds a handler to an element  
`Events.remove(element, type, handler)` removes a handler from an element  
`Events.getTarget(event)` or `Events.getOrigin(event)` returns the element from which the event originated

Initial Title

Event Handling Functions

Initial Tags

javascript, event

Initial Language

JavaScript

Choose a language for easy browsing: