Accéder au texte descriptif d'une image après un clic dessus

Version imprimable

21/04/2009, 15h09
rambc

Accéder au texte descriptif d'une image après un clic dessus

Bonjour,
je voudrais une fonction qui renvoie le texte alternatif d'une image lorsque l'on clique dessus.
Il me faudrait une méthode qui marche avec un nombre inconnu a priori d'images.

Toute info. est la bienvenue.

Salut,

Code:

1
2
3
4
5
6
7
8
9
<script type="text/javascript">
function affiche()
{
 var mesImages=document.images;
for (var i=0;i<mesImages.length;i++)
{mesImages[i].onclik=function(){alert(mesImages[i].alt)}}
}
</script>
<body onload="affiche()">

Merci pour cette réponse mais je n'ai pas réussi à la faire marcher. Voici le code HTML que j'ai essayé de faire :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <html> <head> <script type="text/javascript"> function affiche(){ var mesImages=document.img; for (var i=0;i<mesImages.length;i++){ mesImages[i].onclik = function(){alert(mesImages[i].alt)} } } </script> </head> <body onload="affiche()"> <img src="im_1.jpg" name="images1" width="256" height="192" border="1" alt="im_1"> <img src="im_2.jpg" name="images2" width="609" height="457" border="1" alt="im_2"> </body> </html>
Au pire une solution où il faut ajouter l'action directement dans les balises "image" qui appellerait une fonction JS avec le texte alternatif me conviendrait aussi.

21/04/2009, 19h21
Bovino

Salut,

Remplace par :

Code:

mesImages[i].onclik=function(){alert(this.alt)}

L'explication est dans la FAQ !
21/04/2009, 20h10
rambc

Cela ne marche pas. Je vais me tourner vers une méthode classique directe.

Merci pour la FAQ.
21/04/2009, 20h15
Bovino

Mais non, ne désespère pas 8-)

Code:

var mesImages=document.images;

voire

Code:

var mesImages=document.getElementsByTagName('img');
21/04/2009, 20h26
rambc

Cela ne marche toujours pas. Cela doit venir du fait que mes images sont déjà présentes dans le fichier HTML au lieu d'être créées par le script.

Merci quand même.
21/04/2009, 20h32
Bovino

Non, pas du tout, cela vient du fait que andry a écrit son code rapidement et qu'il y a des fautes de frappe !
Au lieu de juste dire ça ne marche pas, il faut regarder un peu le code et corriger :

Code:

mesImages[i].onclick = function(){alert(this.alt)}

Voici mon code au complet avant que j'aille me coucher :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
<head>
	<script type="javascript">
		function affiche(){
			var mesImages=document.getElementsByTagName('img');
			for (var i=0;i<mesImages.length;i++){
				mesImages[i].onclick = function(){alert(this.alt)}
			}
		}
	</script>
</head>
 
<body onload="affiche()">
<img src="im_1.jpg" name="images1" width="256" height="192" border="1" alt="im_1">
<img src="im_2.jpg" name="images2" width="609" height="457" border="1" alt="im_2">
</body>
</html>

Salut,
Code:

1 2 3 4 function affiche() { for(var i=0; i<document.images.length;i++){document.images[i].onclick=function(){alert(this.alt)}} }
Tester sur FF et IE6 et ça marche. :yaisse2:

Ecoutes voici ton code et cela ne marche pas...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<html>
<head>
	<script type="javascript">
		function affiche()
{
	for(var i=0; i<document.images.length;i++){document.images[i].onclick=function(){alert(this.alt)}}
}
	</script>
</head>
 
<body onload="affiche()">
<img src="im_1.jpg" name="images1" width="256" height="192" border="1" alt="im_1">
<img src="im_2.jpg" name="images2" width="609" height="457" border="1" alt="im_2">
</body>
</html>

23/04/2009, 06h52
Bovino

Code:

<script type="text/javascript">

Type correspond au type mime de la ressource, language à la version souhaitée de JavaScript
23/04/2009, 08h59
rambc

Au temps pour moi, j'avais oublié de changer cela... Effectivement cela marche très bien.

Merci. :king: