Erreur : cette variable est null

**chok371** · 01/01/2011, 09h25

Bonjour,

J'essaie d'accéder aux images de la div #simpleBOX :

Code :

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

1
2
3
4
var cibleDiv = document.getElementById("simpleBOX");
var cibleImg = cibleDiv.getElementByTagName("img");
 
cibleImg.addEventListener(click, openBOX, false);

Mais dans firebug j'ai un message d'erreur, il me dit qu'au niveau de la deuxième ligne, cibleDiv is null

Invité · 01/01/2011, 11h18

Code :

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

1
2
3
4
5
6
7
8
9
 
var cibleDiv = document.getElementById("simpleBOX");
 
var cibleImg = cibleDiv.getElementByTagName("img");
 
 for (var i = 0; i<= cibleImg.length; i++){
cibleImg[i].addEventListener(click, openBOX, false);
 
}

**chok371** · 01/01/2011, 11h33

Merci, mais il y a toujours la même erreur.

Invité · 01/01/2011, 11h47

il faudrait mettre une alert pour voir ce que retourne cibleImg.length

Code :

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

1
2
3
4
5
6
7
8
9
var cibleDiv = document.getElementById("simpleBOX");
 
var cibleImg = cibleDiv.getElementByTagName("img");
alert(cibleImg.length)
 for (var i = 0; i<= cibleImg.length; i++){
cibleImg[i].addEventListener(click, openBOX, false);
 
}

Invité · 01/01/2011, 11h50

et je vient de remarquer

il manque un s a getElementsByTagName

je sais pas pourquoi mais c'est frequent comme erreur

**chok371** · 01/01/2011, 12h16

Le alert, bizarrement, ne marche pas.

J'ai mis le "s" et il y a toujours la même erreur.

Invité · 01/01/2011, 12h25

le probleme doit donc etre en amont

et une alert pour ciblediv sa donne quoi

Code :

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

1
2
3
4
5
6
7
8
9
10
 
 
var cibleDiv = document.getElementById("simpleBOX");
 alert( cibleDiv)
var cibleImg = cibleDiv.getElementByTagName("img");
 
 for (var i = 0; i<= cibleImg.length; i++){
cibleImg[i].addEventListener(click, openBOX, false);
 
}

**chok371** · 01/01/2011, 12h41

ça donne null

Invité · 01/01/2011, 12h48

il faut en conclure que document.getElementById("simpleBOX") n'existe pas

peut etre une erreur de syntaxe sur l'id

**chok371** · 01/01/2011, 14h35

Non il y a bien un div id#simpleBox.

Voici le script complet : http://dl.free.fr/r8HzN43Bp

Peut-être que tu trouveras mieux l'erreur.

**danielhagnoul** · 01/01/2011, 14h47

Bonjour

Envoyé par chok371

Non il y a bien un div id#simpleBox.

Code :

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

var cibleDiv = document.getElementById("simpleBOX");

simpleBOX n'est pas identique à simpleBox !

**chok371** · 01/01/2011, 15h38

Désolé j'ai pas été assez précis : dans ma div c'est bien simpleBOX :

Code :

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

1
2
3
4
5
6
<div id="simpleBOX">
	<img src="img/img-simpleBOX/small/desert.jpg" width="200" height="200" alt="Désert" /> 
	<img src="img/img-simpleBOX/small/meduse.jpg" width="200" height="200" alt="Méduse" />
	<img src="img/img-simpleBOX/small/koala.jpg" width="200" height="200" alt="Koala" />
	<img src="img/img-simpleBOX/small/fleur.jpg" width="200" height="200" alt="Fleur" />
</div>

Invité · 01/01/2011, 16h06

finalement il y a beaucoup d'erreur

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
 
function evenement() {
var cibleDiv = document.getElementById("simpleBOX");
var cibleImg = cibleDiv.getElementsByTagName("img");
 
 for (var i = 0; i<= cibleImg.length; i++){
cibleImg[i].addEventListener('click', openBOX, false);
 
}
 
}
 
function openBOX(small, original) {
 
alert('coucou')
 
}

dans le fichier html rajoute l'appel a la fonction

Code :

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

1
2
 
<body onload='evenement()'>

**chok371** · 01/01/2011, 17h52

Merci, cette fois ça marche.

Mais j'aimerais avoir un peu plus d'infos sur mes erreurs, car je trouve ton code un peu obscur, et ça pourrait m'aider à progresser :

- Pourquoi mettre le tout dans une fonction "evenement()" chargée par le body ?

- Pareil pour le boucle for, est ce qu'elle est obligatoire ?

Encore merci

Invité · 01/01/2011, 18h16

- Pourquoi mettre le tout dans une fonction "evenement()" chargée par le body ?

pour etre certain que la page est completement charge il faut lancer la fonction avec l'evenement onload afin de pouvoitr faire les traitement sur les elements de la pge

Pareil pour le boucle for, est ce qu'elle est obligatoire

la boucle sert a parcourir chaque elements

cibleDiv.getElementsByTagName("img") c'est un tableau qui contient une reference a chaque elements

**chok371** · 01/01/2011, 18h21

pour etre certain que la page est completement charge il faut lancer la fonction avec l'evenement onload afin de pouvoitr faire les traitement sur les elements de la pge

Ok c'est donc toujours obligatoire ? car perso j'ai déjà vu des scripts fonctionnés sans cette technique

cibleDiv.getElementsByTagName("img") c'est un tableau qui contient une reference a chaque elements

Ok merci

**dukej** · 02/01/2011, 10h10

Code :

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

i<= cibleImg.length

devrait s'écrire :

Code :

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

i< cibleImg.length

car sinon on essaye d'accéder à l'élément cibleImg[cibleImg.length] sachant que le dernier élément d'un tableau est cibleImg.length-1, il faut utiliser la condition strictement inférieur, et non inférieur ou égal

Erreur : cette variable est null

JavaScript

Discussions similaires

Partager

Partager