[Erledigt] Mehrere Elemente auf Onclick überprüfen

[lithium]

Hallo Leute,

ich hoffe ihr könnt mir bei folgendem Szenario etwas weiter helfen:

Ich habe 2 Elemente.
Element a ist über dem Element b und b ist größer als Element a.

_____________
|  a   |     |
|______|  b  |
|            |
|     b      |
|____________|

Also so in etwa...

Wenn ich jetzt Element b mit einer onclick Funktion versehe, dass Element a beim Anklicken von b unsichtbar wird, funktioniert es zwar, aber auch, wenn ich auf element a klicke.
Ich möchte aber, dass Element a nur unsichtbar wird, wenn ich auf den Bereich vom sichtbaren b Elements klicke nicht aber, wenn ich auf a klicke...
Ist etwas kompliziert, vllt. erklärt sich folgendes, nicht funktionierendes Code Beispiel etwas die Thematik:

if(($('a').onclick == false) && ($('b').onclick == true)) {
    $('a').style.display = 'none';
}

Das Beispiel hier funktioniert nicht... Logisch, da $('a').onclick ja schließlich eigentlich eine Funktion oder einen abzuarbeitenden Code enthalten sollte, der beim Anklicken ausgeführt werden soll..

$ ist (vom Prototype Framework) eine Funktion für document.getElementById.

Ich hoffe man konnte es halbwegs verstehen, ist etwas kompliziert zu beschreiben.

Gruß,
Lithium

[ChrisB]

Wenn a ein Nachfahrenelement von b ist, ist das relativ einfach zu bewerkstelligen - dann feuert onclick nämlich zuerst auf a, wenn du darauf klickst. Dann musst du nur noch verhindern, dass der Event zu b durchgereicht wird (Stichwort event bubbling).
Bzw. es würde dann auch reichen, den Event auf b abzufangen - und dann einfach zu prüfen, ob das Zielelement des Klicks a war oder nicht (Stichwort event delegation).

[lithium]

this.observe('click', abordclick);

und

abordclick = function(event) {
    Event.stop(event);
    event.cancelBubble = true;
    event.stopPropagation();
}

waren die Lösung.
Hatte mir noch von einem Bekannten Rat geholt.

Gruß,
Lithium