StyleSheet-Angabe verändern mit JavaScript

Zweistein · 13.10.2005

Hallo, ich habe folgendes Problem:

Ich habe eine Tabelle die mit StyleSheets formatiert ist. Es ist so, daß die Hintergrundfarbe der Zeilen sich abwechseln.

Hier mal das StyleSheet:

Code:

.1st { background-color: #202040;}
.2nd { background-color: #303060;}
.mark { background-color: #505070;}

Also die erste Zeile ist hat die Farbe von .1st, die zweite Zeile von .2nd, die dritte Zeile wieder von .1st, u.s.w.

Hier meine programmierte Tabelle (PHP):

Code:

&lt;HTML>
&lt;HEAD>
&lt;/HEAD>
&lt;BODY>
&lt;?PHP
echo (&lt;TABLE>);
for ($i = 0; $i &lt; 20; $i++) {
  if ($i % 2) $cl = 1st;
  else $cl = 2nd;
  echo (&lt;TR class=\.$cl$.\>\n);
  echo (  &lt;TD>...&lt;/TD>\n);
  echo (  &lt;TD>...&lt;/TD>\n);
  echo (  &lt;TD>...&lt;/TD>\n);
  echo (&lt;/TR>\n\n);
}
?>
&lt;/BODY>
&lt;/HTML>

So weit so klar. Jetzt möchte ich bei einem Klick, auf die Zeile (Zellenhintergrundfarbe) sich die Farbe ändert, also von 1st in mark, oder von 2nd in mark.
Ich habe mir etwa sowas gedacht, daß ich mit dem Event-Handler onClick() die Class von 1st oder 2nd in mark umwandle, aber das geht nicht.

Es hat nicht geklappt, also habe ich auch keinen Code dafür.
Ich habe mir auch schon die Funktionen getAttribute() und getElementById() angesehen, um die aktuelle Farbe auszulesen und sie in einer Variable zu speichern, aber das ging auch nicht.

Ich hoffe jemand hat mein Problem verstanden und kann mir weiterhelfen.

Gruß

Zweistein

connyas · 13.10.2005

Code:

&lt;HTML>
&lt;HEAD>
&lt;/HEAD>
&lt;BODY>
&lt;style type=text/css>
.a { background-color:#999999;}
.b { background-color:#CCCCCC;}
.mark { background-color:#0000FF;}
&lt;/style>
&lt;script language=javascript type=text/javascript>
function changeColor(row) {
	row.className = mark;
}
&lt;/script>
&lt;?php
echo (&lt;TABLE>);
for ($i = 0; $i &lt; 20; $i++) {
 if ($i % 2) $cl = a;
 else $cl = b;
 echo (&lt;TR class='.$cl.' onclick='changeColor(this)'>\n);
 echo ( &lt;TD>...&lt;/TD>\n);
 echo ( &lt;TD>...&lt;/TD>\n);
 echo ( &lt;TD>...&lt;/TD>\n);
 echo (&lt;/TR>\n\n);
}
echo (&lt;/table>);
?>
&lt;/BODY>
&lt;/HTML>

BTW, Zahlen im Klassennamen solltest du vermeiden

Zweistein · 17.10.2005

@Conny,

genau das, was mir gefehlt hat - className.
Vielen Dank.

Eine Frage habe ich noch: Wie mache ich hier im Forum den Quelltext so bunt? Muß ich alles von Hand einfärben, oder kann ich mir Vorlagen machen?

Zweistein

connyas · 17.10.2005

Zweistein schrieb:
Eine Frage habe ich noch: Wie mache ich hier im Forum den Quelltext so bunt? Muß ich alles von Hand einfärben, oder kann ich mir Vorlagen machen?

So wie du es gemacht hast is schon fast richtig, wenn du ==> <?php <== klein schreibst, passt es

Zweistein · 17.10.2005

Ok, alles klar. Ich habe mir nur angewhönt Tags grundsätzlich GROSS zu schreiben.

Danke

Thema erledigt

StyleSheet-Angabe verändern mit JavaScript

Zweistein

connyas

Zweistein

connyas

Zweistein

StyleSheet-Angabe verändern mit JavaScript

ANGEBOTE & SPONSOREN

Neueste Themen

Statistik des Forums