DIV javascript

**laxe13** · 11/01/2008, 18h19

Bonjour j'ai ce code :

<script>

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 afficheId(baliseId) 
  {
  if (document.getElementById && document.getElementById(baliseId) != null) 
    {
    document.getElementById(baliseId).style.visibility='visible';
    document.getElementById(baliseId).style.display='block';
    }
  }
 
function cacheId(baliseId) 
  {
  if (document.getElementById && document.getElementById(baliseId) != null) 
    {
    document.getElementById(baliseId).style.visibility='hidden';
    document.getElementById(baliseId).style.display='none';
    }
  }
 
cacheId('contenu'); 
</script>

Avec dans le BODY : javascript:afficheId('p1');javascript:cacheId('p11');

Ce script sert a cacher ou afficher des DIV dans ma page.

Je voudrais le faire évoluer le script sans etre obligé de mettre cacheId, pour tous les Div que je veux ferme. Je veux juste qu'a l'ouverture d'un tous les autres se ferment.

Merci de m'éclairer !

**SpaceFrog** · 11/01/2008, 18h35

dans une boucle sur tous les elements concernés avec une fonction

genre:

Code :

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

1
2
3
4
5
6
 
function swapShox(obj){
 for (i=0;i<collectiondiv.length;i++){
    collectiondiv[i].style.display=(collectiondiv[i]=obj)?'block':'none';
    }
}

et en l'appelant dasn un onclick:

Code :

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

<div onclick="swapshow(this)">

**laxe13** · 11/01/2008, 18h45

merci pour la réponse, je ne vois pas comment l'utiliser, le onclick n'est pas dans le DIV, mais sur un lien hypertexte, j'ai donc un ID sur les div.

Merci

**SpaceFrog** · 11/01/2008, 18h46

Code :

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

<a href="#" onclick="swapshow(document.getElementById('mondiv'));return false;">lien</a>

**laxe13** · 11/01/2008, 18h47

je vais essayer merci !

**laxe13** · 11/01/2008, 18h54

Cela me dis erreur sur la page. j'ai mis deux liens avec les deux div.

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
 
<head>
<script>
function swapShox(obj){
 for (i=0;i<collectiondiv.length;i++){
    collectiondiv[i].style.display=(collectiondiv[i]=obj)?'block':'none';
    }
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
</head>
 
<body>
<a href="#"; onclick="swapshow(document.getElementById('p1'));return false;">lien 1</a>
<a href="#"; onclick="swapshow(document.getElementById('p2'));return false;">lien 2</a>
<div id="p1">OK POUR LE 1</div>
<div id="p2">OK POUR LE 2</div>
</body>
</html>

**SpaceFrog** · 11/01/2008, 19h00

oui alors je ne doannais qu'un exemple ..pas le code complet ...

il fallait renseigner collectiondiv ...
et vérifier le nom de la fonction ...

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
<head>
<script>
function swapshow(obj){
var collectiondiv=document.getElementsByTagName('div');
for (i=0;i<collectiondiv.length;i++){
collectiondiv[i].style.display=(collectiondiv[i]==obj)?'block':'none';
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
</head>
 
<body>
<a href="#" onclick="swapshow(document.getElementById('p1'));return false;" ;>lien 1</a>     
<a href="#" onclick="swapshow(document.getElementById('p2'));return false;" ;>lien 2</a>     
<div id="p1">OK POUR LE 1</div>
<div id="p2">OK POUR LE 2</div>
</body>

**laxe13** · 11/01/2008, 19h03

ok ca fonctionne niquel. Cependant un petit détail important c'est comment précisé que tel ou tel div soit ouvert au demarrage et les autres fermé, car la ils sont tous ouverts.

Merci

**laxe13** · 11/01/2008, 19h15

J'ai trouvé, pour infos pour ceux qui ne savent pas non plus :

Mettre onload son div sur le body :

<body onload="swapshow(document.getElementById('p2'));return false;">

merci