Changer l'image src en utilisant javascript

J'ai 2 listes déroulantes appelées «chapitre» et «question». La «question» changera dynamiquement selon la liste «chapitre». Cette partie fonctionne bien. Je souhaite changer l'image src selon la liste "question". Voici donc le code.

<div id="bookholder"> <form name="book"> <select onchange="setOptions(document.book.chapter.options [document.book.chapter.selectedIndex].value);" size="1" name="chapter"> <option selected="selected" value="0">Choose chapter</option> <option value="1">Chapter 1</option> <option value="2">Chapter 2</option> </select> <select size="1" name="question"> <option value="" select="selected">Choose question</option> </select> </form> </div> <img alt="imageholder" id="imageholder" src="default.png"> <p id="imageholder-text"></p> 

Avec le javascript suivant

 <script type="text/javascript"> function go(){ if (document.ga_naar_rooster.pickem.options[document.ga_naar_rooster.pickem.selectedIndex].value != "none") { location = document.ga_naar_rooster.pickem.options[document.ga_naar_rooster.pickem.selectedIndex].value } } </script> <script type="text/javascript"> function setOptions(chosen){ var selbox = document.book.question; selbox.options.length = 0; if (chosen=="0"){ selbox.options[selbox.options.length] = new Option('Select question',' '); } if (chosen == "1"){ selbox.options[selbox.options.length] = new Option('question 1','11'); selbox.options[selbox.options.length] = new Option('question 2','12');} if (chosen == "2"){ selbox.options[selbox.options.length] = new Option('question 3','22');}} </script> <script type="text/javascript"> $(document).ready(function() { $("#question").change(function() { var nameholder= $("#question").val(); write (nameholder); $('#imageholder').attr('src', nameholder + ".png"); $('#imageholder-text').text(nameholder + ".png"); // For test purposes }); }) </script> 

Le code est joint ici: http://jsfiddle.net/L8ur6/ La fonction de modifier le src en fonction de la liste "question" ne change pas le src du tout. Quelqu'un peut-il me jeter de la lumière? Je vous remercie.

Donnez une ID appropriée à votre choix Sélectionnez une étiquette.

 <select size="1" name="question" id="yourId"> 

Supprimer et remplacer ci-dessous la ligne.

  <script type=\"text/javascript\"> replace with ==> <script type="text/javascript"> 

Essayez le code ci-dessous

 <script type="text/javascript"> $(document).ready(function() { $("#yourId").change(function() { var nameholder= $("#yourId").val(); $('#imageholder').attr('src', nameholder + ".png"); $('#imageholder-text').text(nameholder + ".png"); // For test purposes }); }) </script> 

Donner un identifiant pour sélectionner une étiquette comme

 <select size="1" name="question" id="question"> 

Et code correct comme ci-dessous

 $(document).ready(function() { $("#question").change(function() { var nameholder= $("#question").val(); write (nameholder); $('#imageholder').attr('src', nameholder + ".png"); $('#imageholder-text').text(nameholder + ".png"); // For test purposes }); })