[Javascript] Deel pagina onzichtbaar maken n.a.v. option*

[Verwijderd]

HTML:

<select name="tekstvlakweergevenkeuze">
<option onClick="form.tekstvlak.style.display='none';">Niet weergeven...</option>
<option onClick="form.tekstvlak.style.display='inline';">Bewerken!</option>
</select><br />
<textarea name="tekstvlak" cols="89" rows="8" style="display:none;">

De bedoeling is dus dat zodra je op de pagina komt de textarea is verborgen, maar zodra je klikt op de select optie "Bewerken!" de textarea wordt weergegeven.

Dit werkt prima in Firefox





Maar dit doet IE:





Ik ben echt al uren aan het puzzelen, de reden dat ik hulp hier vraag is omdat ik denk dat er vast wel iemand is die een bruikbare tip kan geven waar ik verder op kan puzzelen

Edit: Oeps, ik ben de topic titel vergeten..

[ Voor 24% gewijzigd door Verwijderd op 24-08-2005 23:31 ]

[Osiris]

Probeer 't tekstvak eens een id mee te geven en dan via document.getElementById etc? Overigens is "onClick" volgens mij foutieve HTML en moet het "onclick" met kleine "c" zijn

[Semyon]

Ik zelf zou de textarea in een div gooien.

Die mark je dan met een id en vervolgens kan je in javascript

code:

    obj = document.getElementById("box_iets");
    obj.style.visibility = "visible";

of desgewenst invisible doen.

code:

<DIV ID="box_iets" STYLE="visible:hidden">
<textarea ...

</DIV>

[ Voor 12% gewijzigd door Semyon op 24-08-2005 23:32 ]

[disjfa]

Osiris schreef op woensdag 24 augustus 2005 @ 23:32:
Probeer 't tekstvak eens een id mee te geven en dan via document.getElementById etc? Overigens is "onClick" volgens mij foutieve HTML en moet het "onclick" met kleine "c" zijn

Daarnaast werkt een onclick ook vaak niet op een option maan kan je beter kijken naar een onchange op de select.

Verder is de manier waarop je het element aanroept compleet verkeerd.

document.forms["formuliernaam"].elements["naam element"].style.display

Of zoals meneer boven me zei

@Semyon waarom een loos extra element toevoegen zonder dat het hoeft

[ Voor 12% gewijzigd door disjfa op 24-08-2005 23:34 ]

[NMe]

Hebben options wel een onclick? Ik gebruik normaal altijd het onchange event van de select.

Verder hoort HTML en Javascript in Webdesign & Graphics, zoals je ook in onze FAQ had kunnen lezen. En als je merkt dat je je topictitel vergeten bent, geef dan een suggestie voor een titel via een TR, met de melding "oeps, topictitel vergeten" kan ik niet veel.

PW>>WG

[André]

code:

<form name="bla">
  <select name="tekstvlakweergevenkeuze" onclick="document.forms['bla'].elements['tekstvlak'].style.display=this.value;">
    <option value="none">Niet weergeven...</option>
    <option value="inline">Bewerken!</option>
  </select><br />
  <textarea name="tekstvlak" cols="89" rows="8" style="display:none;"></textarea>
</form>

/edit:
Even een aanpassing gedaan, een onclick op een option gaat niet goed in IE Nu werkt het prima.

[ Voor 28% gewijzigd door André op 24-08-2005 23:39 ]

[Osiris]

Hmm, volgens W3C hebben zowel select als option wél een onclick-event: http://www.w3.org/TR/html401/interact/forms.html#h-17.6

[NMe]

André, waarom gebruik je een onclick op een select? Is onchange hier niet juist voor bedoeld?

[crisp]

inderdaad; onchange is hiervoor bedoelt. Persoonlijk zou ik het zo doen:

JavaScript:

onchange="this.form.elements['tekstvlak'].style.display=this.options[this.selectedIndex].value"

overigens is een name op je form dan ook overbodig. het name-attribuut is sowieso deprecated (en in sommige smaken zelfs invalid) voor het form-element; gebruik liever een id

[ Voor 6% gewijzigd door crisp op 25-08-2005 06:21 ]

[Bosmonster]

Waarom uberhaupt een dropdownbox voor maar 2 opties... Neem dan 2 radio's...

Of is dit voor de speciale 'maak het je gebruikers zo lastig mogelijk' pagina?