Reihenfolge bei Event-Handlern

[Ralf]

Hallo!

Ich stelle für eine HTML-Seite diverse Zusatzfunktionen zur Verfügung, die addEventListener/attachEvent beim Load-Event ausgeführt werden.

Bisher war mir die Reihenfolge ziemlich egal, weil es zwischen den Funktionen keine Berührungspunkte gab. Nun aber kommt eine Funktion hinzu, die das Ergebnis einer bereits bestehenden Funktion beeinflussen würde.

Wie kann ich Einfluss auf die Reihenfolge nehmen bzw. wann erfolgt die Ausführung des per window.onload gesetzten Handlers? Vor oder nach den anderen Handlern? Oder unterscheidet sich das vielleicht auch noch je nach Browser?

Ralf

[JürgenB]

Hallo Ralf,

ich weiß nicht, wie die Browser die Events abarbeiten. Du könntest aber versuchen, es mit ein paar alerts herauszubekommen.

Ich würde allerdings, wenn die Reihenfolge wichtig ist, nur eine Funktion per onload aufrufen, und in dieser Funktion die Aufgaben in der gewünschten Reihenfolge abarbeiten:

function beimladen() {
 erste();
 zweite();
 ...
 letzte();
}

window.onload=beimladen;

Gruß, Jürgen

[Ralf]

Hallo Jürgen,

mit window.onload kann ich es leider nicht machen, weil die Funktionen einzeln verpackt sind und per addEventListener/attachEvent den Handler setzen müssen. Es ist nicht vorhersehbar, welche Funktionen der Anwender benutzen wird. Ich könnte ihm aber vorschreiben, in welcher Reihenfolge er sie zu definieren hat.

Das mit dem alert ist so eine Sache, weil da die Browser bzgl. Reihenfolge auch so ihre Eigenarten haben. Ich kann aber eine Variable benutzen, an die jede Funktion etwas anhängt, wenn sie durchlaufen wird und so vielleicht feststellen, ob es da eine feste Reihenfolge gibt.

Ralf

[JürgenB]

Hallo Ralf,

... per addEventListener/attachEvent den Handler setzen ...

muss das so gemacht werden, oder darf es auch etwas selbst gestricktes sein? Z.B. könntest Du die Händler in ein Array legen und dieses onload in einer Schleife abarbeiten (ungetestet):

  
function erste() {  
 ...  
}  
function zweite() {  
 ...  
}  
...  
  
var Handler = new Array();  
  
Handler[Handler.length]=erste;  
Handler[Handler.length]=zweite;  
...  
  
function beimladen() {  
 for(var i=0;i<Handler.length;i++) Handler[i]();  
}  
  
window.onload=beimladen; 

die einzelnen Handler können dann (vor dem Feuern von onload) problemlos dynamisch angehängt werden.

Auf meiner "Spielwiese" http://www.j-berkemeier.de/MausOMeter.html mache ich das mit den "onmousemove"-Handlern in jb_mousemove.js

Gruß, Jürgen

[Ralf]

Hallo Jürgen,

ich werde mal über deinen Vorschlag mit dem Handler-Array nachdenken, denn bei Tests hat sich gezeigt, dass Firefox und Opera (addEventListener) die Handler in der Reihenfolge abarbeiten, wie sie definiert worden sind. Der IE (attachEvent) macht es genau umgekehrt.

Vielen Dank für die Anregung!

Ralf