Erich: DIVs ein und ausblenden per Select-Box

Beitrag lesen

Hallo zusammen.

Ich möchte ein Formular machen, dass bei der Auswahl einer bestimmten Option zusätzliche Felder ein oder ausblendet.
Dies weil der Anwender dann je nach Option noch ein Zusatzfeld angeben muss oder nicht und je nach Option halt nicht das gleiche.

Deshalb habe ich gedacht, dass ich per Javascript versteckte Input Felder in Form einer Tabelle erstelle und diese einfach einblende, wenn er die Auswahl getroffen hat.

Das einblenden funktioniert auch sehr gut. Aber wenn er dann etwas anderes wählt, habe ich am Schluss alle Felder eingeblendet.
Das heisst bei einer anderen Wahl blendet er die anderen nicht mehr aus.

Kann mir da jemand helfen?

Danke und Gruss,
Erich

  
<table cellpadding="0" cellspacing="0" width="450">  
    <tr>  
    <td width="65"><b>Dienst:</b></td>  
    <td width="160">  
  <select size="1" name="port" onChange="changeDisplay(true,this.options[this.selectedIndex].value);">  
   <option value="53">DNS</option>  
   <option value="21">FTP</option>  
   <option value="80">HTTP</option>  
   <option value="443">HTTPS</option>  
  </select>  
 </td>  
    <td width="65"><b>E-Mail:</b></td>  
    <td width="160"><input type="text" style="width: 160px;" name="email"></td>  
  </tr>  
  <tr><td colspan="4">  
  
  <div id="21" style="display: none; padding-top:10px;">  
    Einblenden Tabelle 1  
  </div>  
  
  
  <div id="80" style="display: none; padding-top:10px;">  
    Einblenden Tabelle 2  
  </div>  
  
  
  <div id="443" style="display: none; padding-top:10px;">  
    Einblenden Tabelle 3  
  </div>  
  
  </td></tr>  
  </table>