Forum d'entraide PHPFrance

Bonsoir PHPFRANCE,
j'ai une petite demande à vous faire J'aimerais cliquer sur une image tout en changeant mon code. Je m'explique : Chaque image comportent une valeur (0,1,2,3,4 ...) et se trouve dans une section (5 images pour A, 3 pour B ect ...).
imaginons, je clique sur l'image dans la section A et dans mon code, la lettre A changera par la valeur de l'image, vous comprenez?

Si oui, je vous remercie d'avance, et désolé si je suis pas très claire ... :s
Anthony

Bonjour,

Voici un exemple de programme JavaScript qui fait ce que tu veux. L'idée est de stocker dans un tableau de référence, les noms des images et pour chaque image, mémoriser sa section et sa valeur. Comme ça, quand on clique sur une image on utilise son id pour l'identifier et pour retrouver sa section et sa valeur dans le tableau de référence. En suite, on remplace la section trouvée de l'image par sa valeur dans le code stocké dans un DIV.

Voici la page HTML adéquate et le programme Javascript:

<img id="image1" src="imageA.jpg" alt="A" onclick="changeCode(this);" />
<img id="image2" src="imageB.jpg" alt="B" onclick="changeCode(this);" />
<img id="image3" src="imageC.jpg" alt="C" onclick="changeCode(this);" />
<div id="code">ABC</div>
<script>
// tableau des images contenant leur section et valeur
var tab_images = new Array();
tab_images["image1"] = new Array("A","0");
tab_images["image2"] = new Array("B","1");
tab_images["image3"] = new Array("C","2");

function changeCode(imageClicked)
{
	// obtenir le code inscrit dans le div code
	var code = document.getElementById('code').innerHTML;
	// remplacer la lettre de la section de l'image par sa valeur numérique
	var section = tab_images[imageClicked.id][0]; // section de l'image selon le tableau de référence
	var valeur  = tab_images[imageClicked.id][1]; // valeur de l'image selon le tableau de référence
    code = code.replace(section, valeur);
	// replacer le nouveau code dans le div code
	document.getElementById('code').innerHTML = code;
}
</script>

Bonjour,
merci pour avoir pris la peine de m'aider! Mais un petit problème survient lorsque je test le code, je ne vois pas de changement?! Aucun clique ne se fait sur les images? Une erreur de votre part?

Sinon, merci beaucoup, et j'espère avoir une réponse
Bonne fin d'aprêm

C'est bizarre, je l'ai testé sous firefox et internet explorer et ça marche chez moi. non il n'y a pas d'erreur dans le code.
Il remplace bien dans le code la lettre A par 0 quand on clique sur l'image 1 ainsi pour les autres images : B par 1 et C par 2.
T'as quoi comme navigateur

Bonjour, désolé du retard!! J'ai testé sous google chrome, je vais essayer sous Internet

Encore merci.

Alors, désolé, je suis un peu "con", j'avais oublié le > à la fin de <script> ... ! Fonctionne nickel, encore merci à toi!

Bonne soirée

http://img215.imageshack.us/i/imagelec.png/ J'aimerais un style comme ça, je sais je suis un peu "chiant", mais je ne connais pas le Javascript =)

Merci beaucoup pour votre aide!