molily: Mootools variable an function übergeben

Beitrag lesen

$('id1')
aber dann müsste ich ja für jeden Link dieses hinschreiben...

$(...) gibt dir ein Element anhand einer ID. Jetzt willst du aber mehrere mit unterschiedlichen IDs. Jetzt könntest du mit $$ jedes anhand seiner ID ansprechen:

$$("#eins, #zwei, #drei, #vier") usw.

Das gibt dir eine Liste mit all diesen Elementen. Diese Liste hat die Funktion addEvent, um allen Elementen darin einen Handler zuzuweisen. Beispiel:

$$("#eins, #zwei, #drei, #vier").addEvent("click", function () { alert("clicked!"); })

Die Handler-Funktion könntest du vorher natürlich irgendwo zwischenspeichern, wenn du sie mehrfach verwenden willst:

var clickHandler = function () {
   alert("clicked!");
};
$$("#eins, #zwei").addEvent("click", clickHandler);
// später irgendwo:
$$("#drei, #vier").addEvent("click", clickHandler);

Jetzt der Zugriff auf das geklickte Element und dessen ID über das besagte Event-Objekt:

$$("#eins, #zwei").addEvent('click', function(e) {
   alert("Element with ID " + e.target.id + " clicked!");
});

Eine andere Möglichkeit wäre, allen fraglichen Elementen eine Klasse zu geben. Dann musst du sie nicht einzeln über ihre ID ansprechen, sondern kannst schreiben:

<p id="a" class="interaktiv">...</p>
<p id="b" class="interaktiv">...</p>

$$(".interaktiv").addEvent(...);

$$ erwartet CSS-artige Selektoren zum Ansprechen von Elementen im Dokument, .interaktiv ist einfach der Selektor für alle Elemente mit der Klasse "interaktiv". Eine solche Möglichkeit, um Elemente anzusprechen (und z.B. bei allen gefundenen Elementen Event-Handler zu registrieren), haben mittlerweile alle großen JS-Frameworks und man benutzt sie sehr intensiv.

Mathias