<select> --- > bild

Antar att den här frågan passar här..

Det är så här att jag har en rullista, en vanlig enkel <select>
I den så kan man välja olika humör, när man väljer t.ex "glad" så ska det visas en bild nedanför rullistan.
Hur löser man det enklast?

<select onchange="document.getElementById('bildId').src=this.options[this.selectedIndex].value;">
  <option value="happySmiley.gif">Glad</option>
  <option value="sadSmiley.gif">Ledsen</option>
</select>

<img src="happySmiley.gif" id="bildId" alt="smiley" />

<script type="text/javascript">
<!--
function updateImage(s, i) {  //updateImage(select, image)
    document.getElementById('humorBild').src = s.options[s.selectedIndex].value+'.gif';
}
-->
</script>

...

<select onchange="updateImage('this')">
    <option value="glad" selected="selected">Glad</option>
    <option value="ledsen">Ledsen</option>
</select>

<img src="glad.gif" id="humorBild" />

Något sådant kanske? Du får bygga vidare tills det fungerar så som du vill. :)

R// För sent. :r

R2// Nej men hoppsan.. Hade visst gjort ett fel. :r

Hm.. kan tyvärr inte få det att funka..

Jag hade skrivit option 2 lite konstigt.
Nu ska det fungera.

Funkar fortfarande inte.

Vad är det som blir fel då?

Självklart måste du ha två bilder som heter happySmiley.gif och sadSmiley.gif i samma mapp som html-filen, eller ändra sökvägarna till två existerande bilder.