Programmatically adding multiple functions to one event handler (JS)

[Domenic Denicola]

In JavaScript, in my script (i.e. not in the XHTML code), how would I add multiple functions to an event handler? For example, in JS you can do this:

onload = MyFunction();

And in C# you can do this:

event = EventHandler
event += AnotherEventHandler

But can you do something similar in JS?

---

-Domenic Denicola- [CPUA 0x1337] “I was born human. But this was an accident of fate—a condition merely of time and place. I believe it's something we have the power to change…”

[basementman]

Perhaps you can create a single set of functions that serve as an event dispatcher and bundle them up as a .js:

function HookEvent(oElement, cEventName, fFunction) {
var iIndex = -1;

if (oElement.EventList == null)
oElement.EventList = new Array();
else
iIndex = FindEventIndex(oElem, cEventName);

SetEventFunction(oElement, cEventName, iIndex, fFunction);
}

function FindEventIndex(oElem, cEventName) {
var aEvents = oElem.EventList;
if (aEvents != null)
{
for (var iLup = 0; iLup < aEvents.length; iLup++)
{
if (aEvents[iLup][0] == cEventName)
return iLup;
}
}

return -1;
}

function SetEventFunction(oElement, cEventName, iIndex, fFunction) {
if (iIndex > -1)
{
var aEventFcns = oElement.EventList[iIndex][1];
aEventFcns[aEventFcns.length] = fFunction;
}
else
{
oElement.EventList[oElement.EventList.length] = new Array(cEventName, new Array(fFunction))
}

eval("oElement." + cEventName + " = ProcessEventHandlers");
}

function ProcessEventHandlers() {
var oElem = window.event.srcElement;
var cEvent = "on" + window.event.type;

var iIndex = FindEventIndex(oElem, cEvent);
if (iIndex > -1)
{
var aFcns = oElem.EventList[iIndex][1];
if (aFcns == null)
return;

for (var iLup = 0; iLup < aFcns.length; iLup++)
  {
    eval(aFcns\[iLup\]);
  }

}
}

NOTE: THis is just something i typed in and is not guaranteed to work. Just for example purposes.  onwards and upwards...

[Bjoern Graf]

First, don't use eval. Never ever as it'll recompile the current script plus the stuff inside the eval :) To attach more than one event handler to an element, use the method attachEvent (IE) or for w3c browsers addEventListener[^]: var el = document.getElementById("foo"); el.attachEvent("onclick", foo); el.attachEvent("onclick", function () { alert("2nd handler"); }); function foo(event) { alert("1st handler"); }