Ein 'Trick' für Javascript


Thomas Wölfer
Thomas Wölfer

09. April 2010


Ich musste kürzlich ein bisschen was an unsere Online-Dokumentation ändern. Dabei bin ich über folgendes Problem gestossen: Im Event-Modell von Browsern gibt es innerhalb einer Fensters das "Onload" Ereignis: Das wird aufgerufen, wenn die Seite komplett geladen ist. Zu diesem Zeitpunkt kann man prima im DOM rumändern - zum Beispiel nachträglich irgendwelche Dinge einfügen, die während des normalen Ladens des Dokument die Anzeige verzögern würden.

Das Problem dabei ist, das man sich an verschiedenen Stellen an "document.onload" dranhängen will - das das aber eigentlich nicht möglich ist: Anders als in C# kann man nicht einfach "document.onload += function()" schreiben, denn nur die Zuweisung "=" ist zulässig. Die überschreibt aber vorher gesetzte Handler. Was es also braucht ist ein Mechanismus, mit dem man "onload" Handler verketten kann. Ein Lösung dafür sieht so aus:

  function X() { alert ("X"); }
  function Y() { alert ("Y"); }

  var _allOnload = new Array();
  function AddOnload(f)
  {
    if (window.onload)
    {
      if (window.onload != Onload)
      {
        _allOnload[0] = window.onload;
        window.onload = Onload;
      }
      _allOnload[_allOnload.length] = f;
    }
    else
    {
      window.onload = f;
    }
  }
 
  function Onload()
  {
    for (var i=0;i<_allOnload.length;i++)
    {
      _allOnload[i]();
    }
  } 
 
   AddOnload( X );
   AddOnload( Y );