Boutons radio pour modifier une image

**method_man** · 21/04/2008, 20h38

Bonsoir à tous !

Je voudrais pouvoir modifier une image dans ma page HTML grâce à des boutons radio. Après plusieurs essais, je n'y arrive pas. Voici mon code dans le body. Il faut checker un bouton radio et appuyer sur le bouton pour appeler la fonction qui va changer l'image:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<BODY>
<form>
     <input type='radio' name='choice' value='scotland' > Scotland
     <input type='radio' name='choice' value='ireland' > Ireland
 
<input type='button' name='bouton' value='Show it' onClick='changeflag(this.form.choice)'>
</form>
 
<IMG NAME=imgflag SRC= "pictures/which one.jpg">
</BODY>

Et dans le head je modifie la source de l'image en fonction du choix de l'utilisateur:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Beginning of JavaScript -
 
	function changeflag(thechoice) {
 
		if (thechoice(0).check){
 
		 document.imgflag.src = "pictures/" + thechoice.value + ".jpg"
 
		}
		 else {
 
		       document.imgflag.src = "pictures/" + thechoice(1).value + ".jpg"
		       }
		 };
 
// - End of JavaScript - -->
</SCRIPT>
</HEAD>

Voila si vous pouvez me donner des idées, merci d'avance.

M.E.T.H.O.D. M.A.N.

**Jumano** · 21/04/2008, 21h44

Bonsoir,
Essaye ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<SCRIPT LANGUAGE="JavaScript">
function changeflag() {
 
if (document.getElementById('choice1').checked) {
 
		 var thechoice = document.getElementById('choice1').value
		 document.getElementById('imgflag').src = "images/" + thechoice + ".jpg" ;
 
		} else {
		 var thechoice = document.getElementById('choice2').value
		 document.getElementById('imgflag').src = "images/" + thechoice + ".jpg" ;
		}
}
</SCRIPT>

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<form>
     <input type='radio' name='choice' value='scotland' id="choice1" > Scotland
     <input type='radio' name='choice' value='ireland' id="choice2" > Ireland
 
<input type='button' name='bouton' value='Show it' onClick='changeflag()'>
</form>
 
<IMG SRC="pictures/which one.jpg" NAME="imgflag" id="imgflag" />

**method_man** · 21/04/2008, 22h01

C'est parfait ca fonctionne

Jte remercie

A+

Boutons radio pour modifier une image

JavaScript

Discussions similaires

Partager

Partager