Erreur : cette variable est null [Résolu]

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

mekal · 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.

mekal · 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);
 
}

mekal · 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.

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

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

Citation:

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>

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

mekal · 01/01/2011, 18h16

Citation:

- 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

Citation:

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

Citation:

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

Citation:

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

01/01/2011, 11h50	#5
mekal Membre chevronné Krusty Inscription : mai 2009 Messages : 472 Détails du profil Informations personnelles : Nom : Krusty Localisation : France Informations forums : Inscription : mai 2009 Messages : 472 Points : 617 Points : 617	et je vient de remarquer il manque un s a getElementsByTagName je sais pas pourquoi mais c'est frequent comme erreur __________________ programmer n'est pas connaitre tous les moindres détails d'un langage mais savoir exploiter sous toutes ses facettes ce que l'on connait.
	00

01/01/2011, 12h48	#9
mekal Membre chevronné Krusty Inscription : mai 2009 Messages : 472 Détails du profil Informations personnelles : Nom : Krusty Localisation : France Informations forums : Inscription : mai 2009 Messages : 472 Points : 617 Points : 617	il faut en conclure que document.getElementById("simpleBOX") n'existe pas peut etre une erreur de syntaxe sur l'id __________________ programmer n'est pas connaitre tous les moindres détails d'un langage mais savoir exploiter sous toutes ses facettes ce que l'on connait.
	00

02/01/2011, 10h10	#17
dukej Membre expérimenté Duke Jikel Inscription : mai 2010 Messages : 339 Détails du profil Informations personnelles : Nom : Duke Jikel Informations forums : Inscription : mai 2010 Messages : 339 Points : 546 Points : 546	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
	00

01/01/2011, 11h33	#3
chok371 Nouveau Membre du Club Inscription : mars 2010 Messages : 82 Détails du profil Informations forums : Inscription : mars 2010 Messages : 82 Points : 27 Points : 27	Merci, mais il y a toujours la même erreur.
	00

01/01/2011, 12h16	#6
chok371 Nouveau Membre du Club Inscription : mars 2010 Messages : 82 Détails du profil Informations forums : Inscription : mars 2010 Messages : 82 Points : 27 Points : 27	Le alert, bizarrement, ne marche pas. J'ai mis le "s" et il y a toujours la même erreur.
	00

01/01/2011, 12h41	#8
chok371 Nouveau Membre du Club Inscription : mars 2010 Messages : 82 Détails du profil Informations forums : Inscription : mars 2010 Messages : 82 Points : 27 Points : 27	ça donne null
	00

01/01/2011, 14h35	#10
chok371 Nouveau Membre du Club Inscription : mars 2010 Messages : 82 Détails du profil Informations forums : Inscription : mars 2010 Messages : 82 Points : 27 Points : 27	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.
	00

01/01/2011, 17h52	#14
chok371 Nouveau Membre du Club Inscription : mars 2010 Messages : 82 Détails du profil Informations forums : Inscription : mars 2010 Messages : 82 Points : 27 Points : 27	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
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email