Rollover bei Text zu Check-/Radioboxen

[Klaus]

Hallo zusammen,
ich möchte gerne erreichen, dass immer dann, wenn die Maus über den Text zu einer Checkbox fährt, ein Rollover-Effekt ausgelöst wird. Dabei ist mein Problem, dass ich eine dynamisch generierte HTML-Seite habe, so dass icth nicht einfach die Funktion mit dem Label verknüpfen kann. Ich muss also beim Aufbau der Seite alle Checkboxen finden und den dazu gehörenden Texten/Labels die passende Funktion für die Events mouseover und mouseout einbauen. Das gelingt mir problemlos mit den Boxen selber, nicht aber mit den dazu gehörenden Texten. Da das Formular aber auch einen Klick auf die Texte zulässt - sie sind alle als "Label" für die zugehörige Box definiert - brauche ich den Effekt auch dann, wenn die Maus über den Text fährt. Hat jemand dafür eine Lösung? Ich kann einfach nichts finden, was mir den Zugriff auf die Labels ermöglicht.

Danke im voraus!

Gruß Klaus

[rfb]

Moin

du kannst doch das for-Attribut der Label auslesen und der entsprechenden ID der input-Felder zuordnen (bzw. umgekehrt).
Da fällt mir zwar auf Anhieb auch nix besseres ein als das input-Array durchzugehen (machst du ja sowieso), Id auslesen, label-Array durchgehen, auf entsprechendes for-Attribut prüfen (und dann die Schleife durchs Array abbrechen), aber das ist immerhin schon aml ein Anfang ;-)

Gruß
rfb

[Siechfred]

Hell-O!

Ich muss also beim Aufbau der Seite alle Checkboxen finden und den dazu gehörenden Texten/Labels die passende Funktion für die Events mouseover und mouseout einbauen.

Wie wäre es damit:

function addEventToLabels() {  
  var LabelColl = document.getElementsByTagName('label');  
  var InputColl = document.getElementsByTagName('input');  
  for(i=0;i<LabelColl.length;i++)  
    for(j=0;j<InputColl.length;j++)  
      if(LabelColl[i].htmlFor == InputColl[j].id && InputColl[j].type == 'checkbox')  
        LabelColl[i].onmouseover = function() { alert(this.htmlFor); };  
}

Siechfred

[Klaus]

Wie wäre es damit:

Vielen Dank! Das hat mir sehr geholfen. Ich bin noch ziemlich neu in dieser Sprache ...;-)

Schöne Weihnachten!
Klaus

[rfb]

Moin

hier fehlt noch ein Abbruchkriterium für die innere Schleife, denn die muss ja nicht jedesmal bis zum Ende durchlaufen werden:

function addEventToLabels() {  
  var LabelColl = document.getElementsByTagName('label');  
  var InputColl = document.getElementsByTagName('input');  
  for(i=0;i<LabelColl.length;i++) {  
    var flag=true;  
    for(j=0;j<InputColl.length&&flag;j++)  
      if(LabelColl[i].htmlFor == InputColl[j].id && InputColl[j].type == 'checkbox') {  
        flag=false;  
        LabelColl[i].onmouseover = function() { alert(this.htmlFor); };  
}}}

Gruß
rfb