onclick farbe hin und herwechseln

C

Catarrer

0
moin,
ich will ein TD-Feld mir einer javascript function bei onClick hervorheben, bzw wieder "abwählen".

folgenden Code hab ich:

Code: 
<script language="JavaScript"  type="text/javascript">
function highlight {
   if (document.getElementById('Test'+Id).style.backgroundColor == '#e5e5e5') { document.getElementById(id).style.backgroundColor = '#ff3333'; }
   else { document.getElementById(id).style.backgroundColor = '#e5e5e5'; }
   
   }
</script>


[..]


<td id="Test1" onClick="return highlight()" > blabla</td>

haut aber nur hin, um es zu markieren... aba warum?

hoffe, ihr könnt mir wie immer helfen.

gruß Adi
 
Dein Code ist meiner Meinung nach relativer Müll...

Korrigierte (aber nicht garantiert fehlerfreie) Version:

Code: 
<script language="JavaScript"  type="text/javascript">
function highlight(Id) {
   if (document.getElementById('Test'+Id).style.backgroundColor == '#e5e5e5') { document.getElementById('Test'+Id).style.backgroundColor = '#ff3333'; }
   else { document.getElementById('Test'+Id).style.backgroundColor = '#e5e5e5'; }
   
   }
</script>


[..]


<td id="Test1" onClick="highlight(1)" > blabla</td>
 
Zuerst solltest du mal erzählen, was genau du vorhast. Kann man mehrere Zellen auswählen oder immer nur eine zur Zeit? Je nachdem würde ich dynamisch eine Klasse bzw. eine ID vergeben und diese mit CSS entsprechend farblich hervorheben.

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
       "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
<head>
<style type="text/css">
td.markiert
{
   background: blue; /* Farbe, die die Zelle hervorhebt */
}
</style>

<script type="text/javascript">
function highlight(obj)
{
   if(obj.className == "")
      obj.className = "markiert";
   else
      obj.className = "";
}
</script>
</head>

<body>
<table>
<tr>
<td onclick="highlight(this);"> blablatzbla </td>
</tr>
</table>
</body>
</html>

Sei aber vorsichtig mit weiteren CSS-Klassen, die du der Zelle zuweist. Diese würden nach dem Anklicken nämlich überschrieben. Wenn du das verhindern willst, wäre es wohl am einfachsten, du nimmst jQuery, welches entsprechende Klassen und Methoden zum Verändern einzelner CSS-Klassen anbietet.
 
ich war im urlaub und konnte jetzt erst wieder reinschauen

super lösung... danke valenterry =) auf die idee mit den css-classen bin ich garned gekommen... *g*

jetzt läuft alles super
 
Original von skymuss
Ich empfehl dir mal das framework jQuery anzuschauen.
hier .. Warum schwer und mühseliges Javascript
wenn es auch schneller geht ;-)
Zum Vergrößern anklicken....
Schneller hingeschrieben mit Sicherheit. Schneller in der Performance wohl kaum. jQuery, Prototype und Co. für sowas triviales zu verwenden ist mit Kanonen auf Spatzen geschossen.
 
Um antworten zu können musst du eingeloggt sein.
Zurück
Oben