html - Select element display/hide - Udvikleren.dk - Programmering, webdesign og grafik

Tags: javascript html

Bruger #14776 @ 17.03.11 14:50

Hej, jeg ved godt jeg har stillet det her spørgsmål før, men jeg har virkelig brug for hjælp til det. Jeg vil godt have en select tabel være usynlig først, men når man så vælger noget på en anden select tabel, så skal den blive synlig.

Det her er hvad jeg har prøvet indtil videre:

Kode

<select style="display:none">
	<option value="Ris/Ros">Ris/Ros</option>
	<option value="Forslag til hjemmesiden">Forslag til hjemmesiden</option>
	<option value="Rapportering af fejl" onchange="document.getElementById('valg').style.display = 'block'">Rapportering af fejl</option>
</select>
<br>
<div style="display:block" id="valg">
<p>Hvilken sektion på hjemmesiden er det om <span class="info" title="Vælg det som beskriver mest, hvor du har fundet en fejl henne."><u>?</u></span> :</p>
<select name="Sektion">
  <option value="Intet valgt" selected="selected">Intet valgt</option>
  <option value="Forsiden">Forsiden på hjemmesiden</option>
  <option value="Browser sektionen">Browser sektionen</option>
  <option value="Film sektionen">Film sektionen</option>
  <option value="Trailer sektionen">Trailer sektionen</option>
  <option value="WoW sektionen">World of Warcraft sektionen</option>
  <option value="Musik sektionen">Musik sektionen</option>
  <option value="Spil sektionen">Spil sektionen</option>
  <option value="Warcraft sektionen">Warcraft sektionen</option>
  <option value="PS3 sektionen">PS3 sektionen</option>
  <option value="Download sektionen">Download sektionen</option>
  <option value="Runescape sektionen" disabled="disabled">Runescape sektionen (under udvikling)</option>
  <option value="LOTRO sektionen" disabled="disabled">Ringenes Herre sektionen (under udvikling)</option>
  <option value="Darkrune sektionen">Darkrune sektionen</option>
  <option value="RIFT sektionen" disabled="disabled">RIFT sektionen (under udvikling)</option>
  <option value="Dragon Age: Origins sektionen" disabled="disabled">Dragon Age: Origins sektionen (under udvikling)</option>
  <option value="Link sektionen">Darkrune Gamer Site's Links</option>
</select>
</div>

Jeg ved godt, at der er noget der ikke stemmer med display, men det er sådan her det ser ud nu, men det virker ikke bare ved at jeg ændre display funktionerne.

Ved ikke om i kan hjælpe, men jeg vil blive glad, hvis i nu kan

Indlæg senest redigeret d. 17.03.2011 14:53 af Bruger #14776

6 svar postet i denne tråd vises herunder
2 indlæg har modtaget i alt 7 karma

Sorter efter stemmer Sorter efter dato

Bruger #69 @ 17.03.11 16:19

188

Du er på rette spor, men har bare gjort det lidt omvendt.

Den select, der starter som usynlig skal se sådan ud (udfyld selv options-værdierne):

Kode

<select style="display:none" id="hidden_select">
  <option>...</option>
</select>

Og den synlige skal se sådan ud:

Kode

<select onchange="document.getElementById('hidden_select').style.display='block';">
  <option>1</option>
  <option>2</option>
</select>

Bruger #69 @ 18.03.11 12:13

188

Således:

Kode

<script type="text/javascript">

	function toggle_select()
	{
		var selectedOption = document.getElementById('contact_reason').value;
		if( selectedOption == 'Fejl' )
		{
			document.getElementById('contact_detail').style.display = 'block';
		}
		else
		{
			document.getElementById('contact_detail').style.display = 'none';
		}
		
	}

</script>

<select id="contact_reason" onchange="javascript:toggle_select();">
  <option></option>
  <option value="Fejl">Fejl</option>
  <option value="Kontakt">Kontakt</option>
</select>

<select id="contact_detail" style="display:none;">
  <option>...</option>
</select>

Indlæg senest redigeret d. 18.03.2011 12:13 af Bruger #69

Bruger #14776 @ 17.03.11 17:38

Ja, jeg har fået det til at virke nu tak

.

Kan jeg få den til at blive usynlig igen, hvis jeg bagefter vælger noget andet?

Jeg har ændret onchange til onclick, da onchange ikke virkede som jeg ville have at den skulle.

Bruger #69 @ 17.03.11 19:12

188

Det kan du godt. Men du må nok hellere forklare præcist, hvad det er, du vil opnå. Jeg vil dog ikke anbefale at bruge onclick, da det er en trigger, som vil blive udløst, så snart der bliver klikke på den første select - uanset, om brugeren vælger noget eller ej.

Bruger #14776 @ 18.03.11 11:50

Jeg vil godt have at, hvis man vælger noget på en menu, så kommer der en ny menu frem, så man vil kunne forklare lidt mere præcist, hvorfor det er man kontakter mig.

F.eks. man klikker på et valg i den første menu, som kunne hedde Rapportéring af fejl. Så vil der komme en ny menu frem, hvor man vil kunne vælge, hvor man nu har fundet fejlen henne.

Her ville jeg nu godt have at, hvis man nu vælger ikke, at ville Rapportere en fejl, men i stedet vælge andet, så skulle menuen gerne forsvinde, så man ikke bliver forvirret af den.

Det er mest det, som jeg gerne vil opnå med denne funtion.

Bruger #14776 @ 18.03.11 16:24

Fedt, det virker helt præcis som jeg ville have det

.

Tak skal du have

Select element display/hide

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler