Hvordan viser/skjuler jeg elementer i javascript ved hjælp af <select> og ...

Tak igen, jeg fik løst problemet, men tak for din løsning. Jeg holder mig dog til min egen løsning, da jeg gerne vil holde mig fra jquery.


Til folk der har lyst til at se min løsning (udarbejdet af en spansk ven), så vedhæfter jeg den lige:

 <script type="text/javascript">
      function hideShow(selector){
          for (x=0; x<selector.length; x++)
         {
             var division = document.getElementById(selector.options[x].value);
             if (division)
                 division.style.display = (x == selector.selectedIndex ? "inline" : "none");
          }
     }
 </script>
      <select id='test' onChange=hideShow(this)>
      <option value='0'>Vælg...</option>
      <option value='tekst1'>Vis tekst1</option>
      <option value='tekst2'>Vis tekst2</option>
      <option value='tekst3'>Vis tekst3</option>
      </select>
  <div id="showHideContainer">
      <div id='tekst1' style='display:none;'>Tekst 1</div>
      <div id='tekst2' style='display:none;'>Tekst 2</div>
      <div id='tekst3' style='display:none;'>Tekst 3</div>
  </div>

Den finder os det div med det id som der er i valuen. Det er meget længe siden jeg har lavet noget i javascript, bruger for det meste det libary som hedder jQuery. Hvis du henter det(www.jquery.com) kan du gøre det sådan her.

Dette eksempel virker.

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 <script type=""text/javascript">
 function hideShow(){
   $("#showHideContainer > div").hide();
   var showMe = "#"+$("#hideShowSelect").val();
   $(showMe).show();
 }
 </script>
 <select id='hideShowSelect' onChange=hideShow()>
   <option value='0'>Vælg...</option>
   <option value='tekst1'>Vis tekst1</option>
   <option value='tekst2'>Vis tekst2</option>
 </select>
 <div id="showHideContainer">
   <div id='tekst1' style='display:none;'>Tekst 1</div>
   <div id='tekst2' style='display:none;'>Tekst 2</div>
 </div>

Har ikke lige testet det, men ville mene at du kan gøre noget i stil med dette

 <script type="text/javascript">
     function hideShow(id){
     var numberOfDivs = document.geElementById('showHideContainer').getElementsByTagName('div').length;
 
       for(i=0;i++;i<numberOfDivs ){
         document.geElementById('showHideContainer').getElementsByTagName('div')[i].style.visibility = "hidden";
       }
       document.geElementById(id).style.visibility = "visible";
     }
     </script>
     <select id='test' onChange=hideShow(this.value)>
     <option value='0'>Vælg...</option>
     <option value='tekst1'>Vis tekst1</option>
     <option value='tekst2'>Vis tekst2</option>
     </select>
 <div id="showHideContainer">
     <div id='tekst1' style='visibility:hidden;'>Tekst 1</div>
     <div id='tekst2' style='visibility:hidden;'>Tekst 2</div>
 </div>

Hej Andreas, tak for dit hurtige svar.

Har lige testet det du fik skrevet, det virker ikke.

Det skal dog siges at div'erne ikke hedder, 1,2,3,4,5... nogle gange springer den lige nogle tal over med vilje, så det ville være fedt hvis den kunne finde den div som hedder det samme som den value som man har valgt i den der dropdown.

Du skal være opmærksom på at en div som standard har en display: block og ikke inline. Du kan komme ud for at de div'er rykker sig sammen, hvis du bruger inline.

Hvis du bruger visibility, så fylder div'en stadig det den fylder, selvom man ikke kan se den. Det svare lidt til opacity: 0.

Det nemmeste er at bruge jQuery og så skifte indholdet via ajax. Det er også den mest rigtige metode.

Hvis du inkludere jQuery og skriver følgende:

$(document).ready(function(){
$('#test').change(function(){
var valgtTekst = $(this).val();
$('#tekst').load('vaelger.php?valgtTekst='+valgtTekst);
});
});

<select id='test'>
<option value=''>Vælg...</option>
<option value='tekst1'>Vis tekst1</option>
<option value='tekst2'>Vis tekst2</option>
</select>
<div id='tekst'>Intet valgt</div>

I din vaelger.php skal du så modtage valgtTekst med $_GET og slå op i databasen og bare echo det ud på php-siden.

Det skulle spille

// mcardle