Bonjour kenzo,
- Je vous propose d'ajouter ces fonctions dans le bloc script:
//Ici je récupère l'Id de la <div class="choose"> sélectionnée
//Il faut tester la fonction "getElementsByClassName" avec IE, peut être elle ne fonctionne pas avec quelques versions antérieures.
function getDivId(mydiv){
var divs = document.getElementsByClassName("choose");
if(divs.length>0){
for(var j=0; j<divs.length; j++){
if(divs[j] === mydiv)
return j;
}
}
//Cette fonction supprime le bloc ajouté par la fonction AFFICHE()
function clear_elements(id){
var divs = document.getElementsByClassName("choose");
for(var i=0; i<divs.length; i++){
//Exceptée la div sélectionnée
if( i != id){
var list = divs.item(i).children;
for(var j=list.length-1; j>2; j--) //j>2 pour ne pas supprimer les éléments img et span
{
divs.item(i).removeChild(list[j]);
}
}
}
}
//Au click sur une div "choose", on va appeler cette fonction
function show_hide_div(myDiv){
clear_elements(getDivId(myDiv));
AFFICHE(myDiv);
}
-Je n'ai pas changé le corps de la fonction AFFICHE. Concernant le bloc html:
<div class="choose" onclick="javascript:
show_hide_div(this);"><img id="img1" src="image1.jpg" alt="image1" width="67" height="67" />
<br><span>image1</span>
</div>
-J'ai quelques remarques à vous transmettre:
-J'ai substitué la balise <a class="choose"> par une <div>: parce que je vois qu'elle n'a pas d'utilité (href="#"), peut être vous en aurez besoin dans un autre contexte.
-Je pense qu'il faudrait mieux factoriser la fonction AFFICHE() au lieu de répéter son comportement avec AFFICHE1 , 2 , 3, ...
-Et il reste à résoudre le problème de double click sur la meme div. A chaque fois qu'on click la meme div, le code répète le bloc de la fonction AFFICHE.
Cordialement.
