Discussion :

[konarovic]

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 :

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
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

[Golgotha]

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.

[konarovic]

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

[NoSmoking]

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 :

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

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 :

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

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 html :

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

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 :

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

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;
    };
  }