Table row Hintergrundfarbe ändern

Q

quicksurf

Grünschnabel
Hallo,

ich habe in einem Formular 4er Gruppen von Radiobuttons in Tabellenzeilen angeordnet ( siehe Codeauszug unten) und möchte dass sich bei Klick auf einen Radiobutton (nicht auf die Tabellenzeile) die Hintergrundfarbe der entsprechenden Tabellenzeile ändert. Und das sollte im IE und NS funktionieren.
Kann mir jemand helfen ?

Vielen dank.

...
<tr>
<td>Zeile 1</td>
<td align=center><input name="f1r1" type="radio" value="0" onclick="tr-Farbe ändern"></td>
<td align=center><input name="f1r1" type="radio" value="1"></td>
<td align=center><input name="f1r1" type="radio" value="2"></td>
<td align=center><input name="f1r1" type="radio" value="3"></td>
</tr>
<tr>
<td>Zeile 2</td>
<td align=center><input name="f1r2" type="radio" value="0" onclick="tr-Farbe ändern"></td>
<td align=center><input name="f1r2" type="radio" value="1"></td>
<td align=center><input name="f1r2" type="radio" value="2"></td>
<td align=center><input name="f1r2" type="radio" value="3"></td>
</tr>
....
 
setAttribute() dürfte dein freund sein :D

guck mal in selfhtml

hier ein auszug:

setAttribute()

Setzt in einem Element einen Attributwert neu. Ist das Attribut bereits vorhanden, wird sein alter Wert durch den neuen ersetzt. Ist es noch nicht vorhanden, wird es neu angelegt und mit dem neuen Wert belegt.

PHP: 
<html><head><title>Test</title>
<script type="text/javascript">
<!--
function setzen() {
 document.getElementsByTagName("body")[0].setAttribute("bgColor", document.Formular.bgcolor.value);
 document.getElementsByTagName("body")[0].setAttribute("text", document.Formular.text.value);
}
//-->
</script></head>
<body bgcolor="#FFFFCC" text="#E00000">
<form name="Formular" action=""><pre>
Hintergrundfarbe:      <input type="text" name="bgcolor">
Textfarbe:             <input type="text" name="text">
Werte:                 <input type="button" value="setzen" onClick="setzen()">
</pre></form>
</body></html>
Erläuterung:

Das Beispiel enthält ein Formular mit zwei Eingabefeldern, in denen der Anwender neue Werte für die beiden Attribute bgcolor und text des body-Elements eingeben kann. Beim Anklicken des Buttons unterhalb davon wird die _Funktion setzen() aufgerufen, die im Dateikopf notiert ist. Diese Funktion greift mit document.getElementsByTagName("body")[0] auf das body-Element zu und weist ihm mit setAttribute() die neuen Attribute zu. Als erster Parameter wird der Name des zu erzeugenden oder zu ersetzenden Attributs übergeben, als zweiter Parameter der gewünschte Wert. Im Beispiel wird als zweiter Parameter jeweils der Wert aus den Formulareingabefeldern übergeben.

Beachten Sie:

Der MS Internet Explorer ist empfindlich, was den ersten Parameter, also den gewünschten Attribut namen betrifft. Mit bgColor funktionierte das obige Beispiel, mit bgcolor dagegen nicht. Offenbar vermengt der Internet Explorer die erforderliche Syntax für das _HTML-Elementobjekt body mit dem hier geforderten Wert. Im MS Internet Explorer 5.0 Macintosh Edition ist das Beispiel zwar nachvollziehbar, jedoch mit sehr seltsamen Ergebnissen.
Zum Vergrößern anklicken....
 
Zuletzt bearbeitet:
danke, habs sogar etwas einfacher hinbekommen:

<tr id="f1row2">
<td>Zeile 2</td>
<td align=center><input name="f1r2" type="radio" value="0" onclick="document.getElementById('f1row2').style.backgroundColor='beige'"></td>
<td align=center><input name="f1r2" type="radio" value="1"></td>
<td align=center><input name="f1r2" type="radio" value="2"></td>
<td align=center><input name="f1r2" type="radio" value="3"></td>
</tr>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück