Michael: Spalten ausblenden

Beitrag lesen

Hallo

Ich habe jetzt eine Lösung gefunden mit der ich einzelnen Spalten einer Tabelle ausblenden kann, so wie ich das möchte. Dazu hätte ich 2 Fragen :

1. Geht diese Lösung auch in anderen Browsern ? Ich habe es erfolgreich im IE und Firefox getestet, andere habe ich leider nicht installiert.
2. Ein Schönheitsfehler hat es aber : wenn man eine Checkbox anklickt und anschliesend das Browserfenster aktualisiert (F5) kommt das ganze durcheinander. Die dargestellte Spalte entspricht nicht mehr dem was per Häckchen eingestellt ist.
Gibt es dazu eine Lösung. Etwas das beim aktualisieren auch die voreingestellten Ckeckboxen mit "checked" richtig setzt ?

Und hier der entsprechnde Quelltext :

<html>
<head>
<title>Spalten ausblenden</title>

<script language="javascript">
<!--
function toggle( targetId ){
  if (document.getElementById)  {
    var target  = document.getElementById( targetId );
    if (target.style.display == "")    {
      target.style.display = "none"    }
    else    {
      target.style.display = ""    }  }}
      -->
</script>

</head>

<body>

<table border="0" cellpadding="0" cellspacing="0"><tr><td width="100" align="center">
<p>&nbsp;</p>
</td><td width="100" align="center" bgcolor="#FFF0DB">
Birne<br>
<input type="checkbox" onclick="javascript:toggle('01');" checked>
</td><td width="100" align="center" bgcolor="#EEFFDB">
Apfel<br>
<input type="checkbox" onclick="javascript:toggle('02');">
</td></tr></table>

<br>

<table border="0" cellpadding="0" cellspacing="0"><tr><td width="100">

<table border="0" cellpadding="0" cellspacing="0">
<tr><td width="100"><p>&nbsp;</p></td></tr>
<tr><td width="100"><p>mit Wurm</p></td></tr>
<tr><td width="100"><p>ohne Wurm</p></td></tr>
</table>

</td><td>

<table border="0" cellpadding="0" cellspacing="0" width="400" id="01" style="display: all;">
<tr><td width="400" align="center" bgcolor="#FFF0DB"><p>Birne</p></td></tr>
<tr><td width="400" align="center" bgcolor="#FFF0DB"><p>Ja</p></td></tr>
<tr><td width="400" align="center" bgcolor="#FFF0DB"><p>Ja</p></td></tr>
</table>

</td><td>

<table border="0" cellpadding="0" cellspacing="0" width="400" id="02" style="display: none;">
<tr><td width="400" align="center" bgcolor="#EEFFDB"><p>Apfel</p></td></tr>
<tr><td width="400" align="center" bgcolor="#EEFFDB"><p>Nein</p></td></tr>
<tr><td width="400" align="center" bgcolor="#EEFFDB"><p>Nein</p></td></tr>
</table>

</td></tr>
</table>

</body>

</html>

Könnt Ihr mir helfen ?

Gruß
Michael