Texte Dynamique suivant liens cliqués

Bonjour, je cherche à modifier un texte dans une balise div en fonction du click sur des liens.
Bien sûr rien ne change lorsque je clique sur les différents liens...

je suis débutant.

voici mon code javascript:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

function textPhotos() { var photos = document.getElementById('galerie_mini') ; var liens = photos.getElementsByTagName('a') ; // recupération des liens d'images   var texte = document.getElementById('description'); // récupération du texte dans la balise DIV description   for (var i = 0 ; i < liens.length ; ++i) // boucle pour l'ensemble de mes images //au clik.. liens[i].onclick = function() {   texte[0] = document.getElementById('description').innerHTML = "Photo1 etc etc"; texte[1] = document.getElementById('description').innerHTML = "Photo2 etc etc";   // je déclare les description de chacune de mes images qui sont placées dans ma balise DIV "description" }   }

---

Merci

Bonjour,

je ne vois pas ce que tu essaye de faire avec texte[0]= ...
Il te faudra un return False; dans ta fonction onClick pour empêcher le fonctionnement normal du lien.

bonsoir,

ok pour le return false je vais mettre ça en place.

Donc en fait pour expliquer ce que je voulais faire avec mon texte[0] etc:

- texte[0] correspond au texte de mon image 1
- texte[1] correspond au texte de mon image 2

etc etc

je souhaite assigner un texte a chaque image et qu'il apparaisse dans ma balise DIV "description"

merci d'avance

Bonjour,
une ID doit ETRE UNIQUE et la méthode document.getElementById('id_element'); te permet de récupérer l'élément ayant pour ID la string passée en paramètre.

Dans ce bout de code

Code:

---

var texte = document.getElementById('description');

---

tu mets la référence à l'élément ayant comme ID 'description', dans la variable texte.

Dans ce bout de code

Code:

---

texte[0] = document.getElementById('description').innerHTML = "Photo1 etc etc";

---

tu affectes à l'innerHTML de ton élément la valeur 'Photo1 etc etc' ainsi qu'au 1er élément du TABLEAU texte, mais celui ci n'est nullement déclaré en tant que Array donc cela va planter.

A mon sens le plus simple serait d'utiliser un data-description sur tes liens

Code:

---

1 2 3 4

<a href="#" data-description="description photo #1">photos 1</a> <a href="#" data-description="description photo #2">photos 2</a> <a href="#" data-description="description photo #3">photos 3</a> <a href="#" data-description="description photo #4">photos 4</a>

---

et dans ta boucle tu initialises la fonction sur le onclick pour lire la data-description et l'affecter comme il va bien.

Malheureusement IE est à la traine donc il faut y penser

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

var oDescription = document.getElementById('description'); for(var i=0, nb = oLiens.length; i < nb; i++){ oLiens[i].onclick = function(){ if( this.dataset){ // les navigateurs bien ;) descript = this.dataset.description; } else{ // IE -11 descript = this.getAttribute('data-description') } oDescription.innerHTML = descript; // supprime action par défaut return false; }; }

---