Tabellen bgColor mit EventHandler ändern

K

kurland

Mitglied
Guten Morgen

Es ist doch absolut simpel, aber ich schaff es einfach nicht. Bei MousOver soll eine Tabellenzelle eine andere Farbe erhalten und beim anklicken nochmals eine andere, die sich beim MouseOver nicht mehr ändert.

Bitte helft mir, Gruss Roli
HTML: 
<html>
<head>
<title>Tabelle</title>

<style type="text/css">
<!--
.hand {  cursor: hand}
-->
</style>

</head>

<body bgcolor="#FFFFFF" text="#000000">

<script type="text/javascript">
<!--

function TRKlick()
{
this.tr.FrageTR.bgcolor == '#FF0000';
if (this.tr.FrageTR.bgcolor == '#FF0000') onMousOver="this.tr.FrageTR.bgcolor = '#FF0000'";
if (this.tr.FrageTR.bgcolor == '#FF0000') onClick="this.tr.FrageTR.bgcolor = '#E7E7E7'";
}


function TROver()

{
if (this.tr.FrageTR.bgcolor == '#E7E7E7') onMousOver="this.tr.FrageTR.bgcolor = '#CCCCCC'";
}
//-->
</script>

<table width="62%" border="1">
  <tr name="FrageTR" onMouseOver="TROver()" onClick="TRKlick()" bgcolor="#E7E7E7"> 
    <td class="hand">&nbsp;</td>
    <td class="hand">&nbsp;</td>
    <td class="hand">&nbsp;</td>
  </tr>
</table>
</body>
</html>
 
Hi,

so wie Du es angehst, wird das nichts werden. Folgendes funktioniert z.B. im IE, Forefox und NN7 (obwohl wohl ältere Versionen von Netscape das Attribut backgroundColor nicht unterstützen):
HTML: 
<script language="JavaScript" type="text/javascript">
var isactive = false;

function switchCell(obj, c1, c2) {
    if (isactive == false) {
        obj.style.backgroundColor = c1;
    } else {
        obj.style.backgroundColor = c2;
    }
    isactive = !isactive;
}

function changeColor(obj, color) {
    if (isactive == false) obj.style.backgroundColor = color;
}
</script>
<body>
<table width="50%" border="1">
  <tr>
    <td id ="mycell" style="background-Color: #FF0000" onMouseOver="changeColor(this, '#FFFF00')" onMouseOut="changeColor(this, '#FF0000')" onClick="switchCell(this, '#FF00FF', '#FFFF00')">&nbsp;</td>
  </tr>
</table>
</body>
Die aktuelle Farbe beim onClick abzufragen ist auch nicht sehr einfach, da (wie ich grade bemerkt habe) z.B. Firefox das Attribut als String mit den RGB-Werten ausgibt. Hier würde ich eine Hilfsvariable verwenden, die abwechselnd auf true bzw. false gesetzt wird.
Wenn sich die Farbe beim mouseOver nach dem onClick nicht mehr ändern soll, kannst Du diese Variable ebenfalls abfragen.


Gruß

.
 
Zuletzt bearbeitet:
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück