cartman1984: Zugriff auf DOM-Elemente mit display:hidden;

Beitrag lesen

Hallo hallo ihr beiden,

ich war mit schreiben mal wieder zu schnell, sorry. Klar heißt es firstChild und display: none.

So langsam komme ich weiter:

Im Array tooltips stehen alle Elemente mit der Klasse "icon_help", richtig.
Mit tooltips[i].getElementsByTagName('div')[0] greife ich auf das div "tooltip_text" zu, klappt auch.
Die Abfrage tooltips[i].hasChildNodes() klappt dagegen nicht, ich weiß nicht wieso. Zur Abhilfe füge ich den DIV jetzt in jedes icon_help-Objekt ein.

Dann gibt es aber noch ein großes Problem, das sich mir wahrscheinlich durch fehlendes Verständnis der JS-Vorgehensweise nicht erschließt:

Die mouseover-Events füge ich per Funktion beim laden des Dokuments hinzu. Die Schleife sieht komplett jetzt so aus:

  
for (var i=0;i<tooltips.length;i++) {  
  var tooltip_text = tooltips[i].getElementsByTagName('div').[0].innerHTML;  
  tooltips[i].addEventListener("mouseover", function(){showWMTT(tooltip_text), false);  
  tooltips[i].addEventListener("mouseout", function(){hideWMTT(), false);  
}  

Das funktioniert beim laden der Seite wunderbar. Jetzt das Problem: Sobald das mouseover-Event feuert, springt der Code in die Zeile mit dem addEventListener("mouseover"...) und führt die Anweisung nochmal aus. Natürlich steht die Variable i jetzt auf tooltips.length und tooltip_text ist leer. Der EventHandler sollte doch eigentlich schon längst erstellt sein, oder nicht?

Ein verwirrter Cartman