molily: Javascript function beim Laden ausführen

Beitrag lesen

Hallo,

var eProp = type + fn;
    obj['e' + eProp] = fn;
    obj[eProp] = function() {
      obj'e' + eProp;
    };
    obj.attachEvent('on' + type, obj[eProp]);

Dieses Gefummel mit Function.prototype.toString() als Hash ist nur nötig, weil IE 5 kein Function.prototyp.apply() versteht.

Sprich, wenn du IE 5 sowieso mit dieser Methode abspeist:

var oLoad = obj['on' + type];

if (typeof(obj['on' + type]) != 'function') {
      obj['on' + type] = fn;
    } else {
      obj['on' + type] = function() {
        oLoad();
        fn();
      }
    }

...dann kannst du für IE > 5.0 auch gleich apply() verwenden. Die Frickelei mit apply() bzw. mit obj[type + fn] = function () { obj'e' + type + fn; }; macht man nur, damit man mit this auf das Element zugreifen kann, dessen Event-Handler gerade gefeuert wird. Denn der IE kennt die DOM-Events-Eigenschaft currentTarget nicht, this hat aber denselben Effekt.

Die Event-Eigenschaften target (IE: srcElement) verweist auf das Element, bei dem das Ereignis tatsächlich passierte, currentTarget (IE: this) hingegen auf das Element, dessen Handler das Ereignis gerade. Meistens interessiert einen nur target/srcElement. currentTarget/this braucht man, wenn man in Erfahrung bringen will, ob das Element, dessen Handler gefeuert wurde, auch das Ziel des Elements ist. Wenn das der Fall ist, stimmen target/srcElement und currentTarget/this überein. In dem Fall befindet sich der Event in der Target-Phase, andernfalls in der Capturing- oder Bubbling-Phase (im IE gibt es nur die Target- und die Bubbling-Phase). Aufsteigende Events will man meistens nicht verarbeiten, da sie meist schon in Target-Phase verarbeitet wurden.

Gut, mir fällt jetzt auch kein Praxisbeispiel ein, bei dem es unbedingt nötig ist, auf currentTarget/this zuzugreifen, um sie mit target/srcElement zu vergleichen. Meistens nutzt man das Feature des Bubblings gar nicht und registriert Handler so, dass sie sich nicht in die Quere kommen, also jeder Event nur genau einen Handler auslöst. (Genauer gesagt, Bubbling benutzt man eigentlich gerade dazu, um die aufsteigenden Events verschiedener Kindelemente zu verarbeiten, damit man nicht dutzende Handler bei den einzelnen Kindelementen registrieren muss. Dann ist der Zugriff auf target/srcElement notwendig, aber nicht auf currentTarget/this.) Man bräuchte verschachtelte Elemente mit Handlern für denselben Event-Typ, damit es überhaupt dazu kommt, dass ein Event zwei Handler auslösen kann. Und das ist meist gewollt.

Sprich, für die meisten einfachen Event-Handling-Aufgaben reichen einfache addEvent-Funktionen aus. Wenn man this nicht braucht, braucht man auch keine Bastelei mit apply() oder Closures.

Mathias