Avatar billede rookieboy Nybegynder
03. maj 2007 - 17:19 Der er 7 kommentarer

Select option show / hide layer

Hejsa,

Jeg har virkelig brugt lang tid på Google på at finde en funktion der kan show / hide layer ud fra hvad brugeren vælger i en selectbox.

Er der nogle der kan hjælpe?
Avatar billede roenving Novice
03. maj 2007 - 17:22 #1
<select ... onchange="document.getElementById('dinDiv').style.display=this.selectedIndex>2?'block':'none';">
Avatar billede rookieboy Nybegynder
04. maj 2007 - 15:05 #2
Hmm. Det virker ikke..
Jeg forsøger at skjule en div, som kun skal vise hvis en option er valgt. Vælger man en anden option skal div skjules igen. Har forsøgt med følgende men det virker ikke:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Hide/Show Test</title>
<style>
#mindiv {visibility:hidden;}
</style>
</head>
<body bgcolor="#ffffff">
<form method="post" name="form" action="ProcessData.aspx">
<select onchange="document.getElementById('mindiv').style.display=this.selectedIndex=3?'block':'visible';">
<option value="null">Vælg event (gem div)</option>
<option value="1">Item1 (gem div)</option>
<option value="2">Item2 (gem div)</option>
<option value="3">Item3 (vis div)</option>
<option value="4">Item4 (gem div)</option>
</select> 
</form>             
<br><br><br><br>                     
<div id="mindiv">Her er indholdet</div>
</body>
</html>

Hvad er der galt?
Avatar billede roenving Novice
05. maj 2007 - 05:54 #3
I javascript bruges 2 lighedstegn til at udforske lighed, et bruges kun til værdi-tildeling ...

Så det skal bare ændres til:

<select onchange="document.getElementById('mindiv').style.display=this.selectedIndex==3?'block':'visible';">
Avatar billede roenving Novice
05. maj 2007 - 05:57 #4
Hrm, du havde så taget udgangspunkt i visibility, hvilket i nogen sammenhænne kan være fornuftigt, men oftest ikke er det:

<html>
<head>
<title>Hide/Show Test</title>
<style>
#mindiv {display:none;}
</style>
</head>
<body bgcolor="#ffffff">
<form method="post" name="form" action="ProcessData.aspx">
<select onchange="document.getElementById('mindiv').style.display=this.selectedIndex==3?'block':'none';">
<option value="null">Vælg event (gem div)</option>
<option value="1">Item1 (gem div)</option>
<option value="2">Item2 (gem div)</option>
<option value="3">Item3 (vis div)</option>
<option value="4">Item4 (gem div)</option>
</select> 
</form>             
<br><br><br><br>                     
<div id="mindiv">Her er indholdet</div>
</body>
</html>
Avatar billede roenving Novice
05. maj 2007 - 05:58 #5
-- og så hedder det:

<style type="text/css">
Avatar billede rookieboy Nybegynder
06. maj 2007 - 12:10 #6
Fantastisk - det virker! Tak for hjælpen.
Avatar billede roenving Novice
07. maj 2007 - 13:37 #7
Velbekomme '-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester