Discussion :

[thanathz]

J'ai plusieurs div nommés P0, P1, P2, ..., Pn

j'essaye de modifier ma fonction javacript qui pour l'instant ne me retourne que 5 entités.
l'actuelle est comme cela (elle fonctionne parfaitement):

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
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
function switchBest( layerName ) {
    if ( document.getElementById ) {
		var player[1] = document.getElementById( 'P0' );
		var player[2] = document.getElementById( 'P1' );
		var player[3] = document.getElementById( 'P2' );
		var player[4] = document.getElementById( 'P3' );
		var player[5] = document.getElementById( 'P4' );
 
		player[1].style.display = 'none';
		player[2].style.display = 'none';
		player[3].style.display = 'none';
		player[4].style.display = 'none';
		player[5].style.display = 'none';
 
		switch(layerName) {
			case "P0":
  				player[1].style.display = 'block';
  				break;
			case "P1":
			  	player[2].style.display = 'block';
  				break;
			case "P2":
  				player[3].style.display = 'block';
  				break;
			case "P3":
  				player[4].style.display = 'block';
  				break;
			case "P4":
  				player[5].style.display = 'block';
  				break;
			default:
  				break;
        	}
      	}
    }
switchBest('P0');

Maintenant je veux pouvoir rendre cette fonction dynamique c'est à dire totalement transparente si j'utilise 2 éléments ou 500.

J'ai donc crée cette fonction. Ajoutant un paramètre qui me donne le nombre maximum d'élements que j'aurais (utile pour l'initialisation de mon tableau).
j'ai donc écrit cette 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
 
function switchBest( layerName, maxValue ){
    var player = new Array(maxValue);
    if ( document.getElementById ) {
         var i=1;
         while(i<maxValue){
               player[i]=document.getElementById ( ('P' + i) ); 
               player[i++].style.display = 'none'; // on cache tous les elements
               }
 
        player[layerName.replace(P, "")].style.display = 'block';
         }
    }
switchBest('P0');

Tous mes elements sont bien cachés, P0 est affiché. mais j'ai ce message qui apparait à chaque click et Pn ne s'affiche pas,

erreur: player[i++] has no properties

Donc quand ont fait une concatenation comme 'P' + i j'ai l'impression que i est ensuite traité comme un string.... ai-je raison?
Et si c'est le cas, je fais comment pour éviter ça?

[David.V]

A priori, ça devrait être bon. Tu peux toujours 'caster' d'avantage de cette façon

Code :

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

player[i]=document.getElementById ('P' + i.toString());

mais je pense pas que ça change grand chose. L'erreur vient d'ailleurs peut être.

Tu es sur que les objets Pn existent ? comment les généres-tu ?

[hunter]

heu

il me semble pas que ça puisse pas fonctionner
player[i++] il est pas initialisé ...
player[i].style.display = 'none';
ça va fonctionné
et tu fais i++ a la fin

Code :

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

1
2
3
4
5
6
 
while(i<maxValue){
               player[i]=document.getElementById ( ('P' + i) );
               player[i].style.display = 'none'; // on cache tous les elements
               i++; 
               }

cherche un peut la prochaine fois ...

[Caine]

Le problèpme vient du cast automatique du javascript :
'p' + i => donne un entier je crois et non 'p2' par exemple.
Instrumente ton code comme suit pour savoir:

Code :

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

1
2
3
4
5
6
7
8
9
 
while(i<maxValue){
name =  ('P' + i);
player[i]=document.getElementById ( name );
   if (!player[i])                
       alert("Null object :" + name);
   else
       player[i++].style.display = 'none'; // on cache tous les elements
              }

Pour hunter : Non, il utilise une post-incrémentation, donc i est incrémenté après exécution de l'instruction courante.

heu

il me semble pas que ça puisse pas fonctionner
player[i++] il est pas initialisé ...
player[i].style.display = 'none';
ça va fonctionné
et tu fais i++ a la fin

Code :

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

1
2
3
4
5
6
 
while(i<maxValue){
               player[i]=document.getElementById ( ('P' + i) );
               player[i].style.display = 'none'; // on cache tous les elements
               i++; 
               }

cherche un peut la prochaine fois ...

[David.V]

heu

il me semble pas que ça puisse pas fonctionner
player[i++] il est pas initialisé ...
player[i].style.display = 'none';
ça va fonctionné
et tu fais i++ a la fin

Code :

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

1
2
3
4
5
6
 
while(i<maxValue){
               player[i]=document.getElementById ( ('P' + i) );
               player[i].style.display = 'none'; // on cache tous les elements
               i++; 
               }

cherche un peut la prochaine fois ...

C'est plutot toi qui devrait te document avant.

player[i++] est une syntaxe correcte (post incrémentation comme le dit Caine).

[hunter]

a dsl mais je pensais vu l'erreur que ça pouvais être ça ...

[thanathz]

merci du coup de main. Bon en effet, ce n'est pas un problème de Cast, mais plutôt de moi qui ai encore des problèmes avec Javascript...

C'est surtout que j'ai pas vu une betise plus grosse que moi!

J'avais un problème avec mon appel et le nom de mes div (j'allais de 1 à 5 alors que mes div étaient numérotés de P0 à P4...)

Enfin il y en avait une deuxième au niveau de player[layerName.replace(P, "")].style.display = 'block'; ou P doit être 'P'...

j'ai fait les modifs qui vont bien en ajoutant le test de Caine. et ça donne ça:

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
 
function switchBest( layerName, maxValue ){
    var divName;
    var player = new Array(maxValue);
    if ( document.getElementById ) {
         var i=0;
         while(i<maxValue){
                divID=('P' + i);
               player[i]=document.getElementById ( divID );
               if(!player[i]) alert("null object: " + divID);
               else player[].style.display = 'none'; // on cache tous les elements
               i++;
               }
 
        player[layerName.replace('P', "")].style.display = 'block';
         }
    }
switchBest('P0', 2);

il suffit d'avoir des div ou tout autre objet avec un format comme suit:

Code :

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

<div id="P0">bla blablla</div><div id="P1">P1 était caché!</div>

et ailleurs des liens pour montrer et cacher:

Code :

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

1
2
3
 
<a href="javascript:switchBest('P0', '2');">cacher</a>
<a href="javascript:switchBest('P1', '2');">montrer</a>

pour une application sur la page d'acceuil de mon site meilleur perf est géré de cette façon.