hidden / visible

[sepp]

Hallo Zusammen

Ich habe 4 select Felder 2 davon sichtbar welche ich mittels JS sichbar bzw unsichtbar mache.

Das Hauptselect (immer sichtbar) wird mit onChange="zusatz()" EIN js AUSFÜHREN welches eines der hidden Felder einblendet und gleichzeitig das 2 sichtbar ausblendet.

Das geht soweit gut aber wenn ich nun das zweite einblende wird das Select nicht ausgeblendt welches aber beim ersten geht.

Ich hoffe Ihr versteht mich - hier das Script.

function zusatz()
{
if (document.form1.bericht.value=="sz")
	{	
	document.getElementById("bericht_zusatz").style.visibility = "visible";
	document.getElementById("klasse_s").style.visibility = "hidden";
	}
	else
	{
	document.getElementById("bericht_zusatz").style.visibility = "hidden";
	document.getElementById("klasse_s").style.visibility = "visible";
	}
if (document.form1.bericht.value=="jtl")
	{	
	document.getElementById("bericht_zusatz_klasse").style.visibility = "visible";
	document.getElementById("klasse_s").style.visibility = "hidden";
	}
	else
	{
	document.getElementById("bericht_zusatz_klasse").style.visibility = "hidden";
	document.getElementById("klasse_s").style.visibility = "visible";
	}
}

<select name="bericht"  class="select_all"  style=" width:300px; height:22px;" onChange="zusatz()" >
  <option value="sz">liste1</option>
  <option value="jtl">liste2</option>
</select>
<select name="klasse_s" class="select_all" id="klasse_s"  style=" width:300px; height:22px;"  >....</select>

 <select name="bericht_zusatz" id="bericht_zusatz" class="select_all"  style=" visibility:hidden; width:100px; height:22px;"  >
 	<option >Montag</option>
	<option >Dienstag</option>
	<option >Mittwoch</option>
	<option >Donnerstag</option>
	<option >Freitag</option>
 </select>
<select name="bericht_zusatz_klasse" id="bericht_zusatz_klasse" class="select_all"  style=" visibility:hidden; width:300px; height:22px;"  >
 	<option value="1" >1.A</option>
	<option value="2" >2.A</option>
	<option value="3" >3.A</option>
	<option value="4" >4.A</option>
 </select>

Konkret wird nun beim anwählen von "sz" das Feld klasse_s nicht ausgebelndet beim anwählen von jtl funktioniert alles richtig.

Weiss wer was ich falsch mache?

[AmicaNoctis]

Hallo,

deine zwei if..else-Anweisungen überschreiben sich gegenseitig. Die erste sorgt dafür, dass #klasse_s ausgeblendet wird, wenn man die Option sz wählt, aber die zweite Bedingung blendet es wieder ein, weil es nicht jtl ist.

Du musst das zu einem if(…){…}else if(…){…}else{…} zusammenfassen.

Installier dir Firebug für Firefox, dann kannst du solche Sachen im Debugger durchsteppen und siehst zum Einen in welche Bedingungen er reinspringt und zum Anderen auch die aktuellen Werte aller im Scope befindlichen Variablen.

Gruß,

Amica

[rossixx]

ähliches problem einblenden ausblenden

<script type="text/javascript">
<!--
function ShowMe(a){
    var e=document.getElementById(a);
    if(!e)return true;
    if(e.style.display=="none"){
        e.style.display="block"
    }
    else {
        e.style.display="none"
    }
    return true;
}
//-->
</script>

<div style="display:none;" id="<?php echo "para$iii"; ?>">

         <?php echo "$info_rest"; ?>
         <a onclick="return ShowMe('<?php echo "para$iii"; ?>')" href="javascript:void(0)">
          ... less </a></div>
     <a onclick="return ShowMe('<?php echo "para$iii";?>')"href="javascript:void(0)">      
          ... more </a>

wenn ich auf more klicke erscheint der folgetext, aber der more button verschwindet nicht :-(

wie kann man das lösen ??

dankeschön