Lien sans rafraichir la page [Résolu]

[mars77]

Bonjour à tous,

J'ai codé une page ou quand je clique sur le lien il m'affiche une photo dans la même page sans la rafraichir.

Ce que j'aimerai en plus faire c'est ajouter un petit texte à l'image.

je bloque comme passer mes infos texte et de le récupérer avec le lien de l'image.

Code html :

1
2
3
<a href="#" onclick="document.getElementById('monImage').src ='image/drapeau.png';document.getElementById('monImage').style.visibility='visible';reset_texte('monTexte1');">Afficher l'image</a> 
<img id="monImage" src="image/pixel.gif" style="visibility='hidden';">
<p id="monTexte1" style="visibility:hidden;"></p>

Est ce que je dois faire un code javascript ?

Merci à celui qui pourra m'aider.

[NoSmoking]

Bonjour,
en modifiant le innerHTML

Code :

document.getElementById('monTexte1').innerHTML = 'le texte de l\'image';

[mars77]

J'ai modifier comme ceci mon code.
Est ce que c'est juste ? car le texte ne s'affiche pas ???

Code :

1
2
3
<a href="#" onclick="document.getElementById('monImage').src ='image/drapeau.png';document.getElementById('monImage').style.visibility='visible'; document.getElementById('monTexte1').innerHTML = 'le texte de l\'image';">Afficher l'image</a> 
<img id="monImage" src="image/pixel.gif" style="visibility='hidden';">
<p id="monTexte1" style="visibility:hidden;"></p>

Merci pour votre aide

[SpaceFrog]

le code est correct, mais tu as juste oublié une petite chose ...
Tu rends bien ton image visible avec ce code

Code :

document.getElementById('monImage').style.visibility='visible';

... mais pas ta zone contenant le texte ...
Son contenu est bien changé, mais il reste invisible
fais en autant pour l'élément dont tu as modifié le innerHTML et il apparaitra

[mars77]

Merci pour votre aide et explication.
Cela fonctionne tip top.

Code :

1
2
3
<a href="#" onclick="document.getElementById('monImage').src ='image/drapeau.png';document.getElementById('monImage').style.visibility='visible';document.getElementById('monTexte1').innerHTML = 'le texte de l\'image';document.getElementById('monTexte1').style.visibility='visible';">Afficher l'image</a> 
<img id="monImage" src="image/pixel.gif" style="visibility='hidden';">
<p id="monTexte1" style="visibility:hidden;"></p>