erreur script getElementsByTagName

Version imprimable

Bonjour,
J'ai une rerraur dans mon script... Qui n'a pas l'air de gener ff mais par contre qui gene ie :-(
Code:

1 2 3 4 5 6 7 8 9 //js var photos = document.getElementById('galerie_mini'); // On récupère l'élément ayant pour id galerie_mini var liens = photos.getElementsByTagName('a'); //html <ul id=\"galerie_mini\">"; $Html.="<li><a href=\"".$V."\" title=\"Cliquez pour agrandir l'image\"><img src=\"".$V."\" style=\"".$ImgRedimM."margin-left:".$MarginLeftM."px;margin-top:".$MarginTopM."px;\" alt=\"".$Name."_".$K."\" /></a></li>";
erreur : "Null" a la valeur null ou n'est pas un objet...

J'ai tente de mettre un idee a (<a id=\"LienPhotoJs\"....) mon lien puis de mettre getElementById mais rien de mieux...

Merci

17/02/2010, 12h46
SpaceFrog

getElementByTagName est une proprété de document... non applicable à un objet de la page

Passe pas les selecteurs de jquery ...
17/02/2010, 12h54
Gatsu35

Citation:

Envoyé par SpaceFrog

getElementByTagName est une proprété de document... non applicable à un objet de la page

:calim2::calim2::calim2::calim2:
C'est getElementById qui est une méthode de document.
getElementsByTagName est une méthode native du DOM pour n'importe quel noeud du DOM :zoubi:

Citation:
Envoyé par guigo
Bonjour,
J'ai une rerraur dans mon script... Qui n'a pas l'air de gener ff mais par contre qui gene ie :-(
Code:

1 2 3 4 5 6 7 8 9 //js var photos = document.getElementById('galerie_mini'); // On récupère l'élément ayant pour id galerie_mini var liens = photos.getElementsByTagName('a'); //html <ul id=\"galerie_mini\">"; $Html.="<li><a href=\"".$V."\" title=\"Cliquez pour agrandir l'image\"><img src=\"".$V."\" style=\"".$ImgRedimM."margin-left:".$MarginLeftM."px;margin-top:".$MarginTopM."px;\" alt=\"".$Name."_".$K."\" /></a></li>";
erreur : "Null" a la valeur null ou n'est pas un objet...

J'ai tente de mettre un idee a (<a id=\"LienPhotoJs\"....) mon lien puis de mettre getElementById mais rien de mieux...

Merci
Ton pb vient surtout du fait que tu éxécutes le JS avant que le HTML soit généré.

Il faut éxécuter ton code dans une fonction au chargement du dom (domready) ou au chargement de la page (onload).

ex :
Code:

1 2 3 4 window.onload = function() { ton code ici }

17/02/2010, 12h57
Bovino

Spaffy, tu confonds avec getElementsByName.
getElementsByTagName est une méthodes des éléments HTML.

@guigo : tu nous montres une ligne de JavaScript, une ligne HTML et une ligne PHP, c'est un peu léger pour pouvoir répondre à ta question...
17/02/2010, 13h11
SpaceFrog

arf exact, j'ai eu le cas récemment avec les names ... et pas les tagNames ...

Y'a longtemps que je ne m'étais pas déchiré comme ça :mouarf3:

bonjour a tous,
merci pour vos reponse. Du coup je complete le code :

Code:

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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
 
//fonction js
function displayPics() 
{ 
 
    var photos = document.getElementById('galerie_mini'); 
 
    var liens = photos.getElementsByTagName('a'); 
  // var liens = photos.getElementById('LienPhotoJs'); 
 
 
    var big_photo = document.getElementById('big_pict') ; 
 
 
    for (var i = 0 ; i < liens.length ; ++i) { 
        // Au clique sur ces liens  
        liens[i].onclick = function() { 
		    big_photo.src = this.href; 
            big_photo.alt = this.title; 
 
	redimImage(this.href,300,300, function(StyleHtml) {
				big_photo.style.width = StyleHtml[0]+"px";
				big_photo.style.height = StyleHtml[1]+"px";
 
				margLeft=(300-StyleHtml[0])/2+"px";
				margTop=(300-StyleHtml[1])/2+"px";
 
				big_photo.style.marginLeft = margLeft ;
				big_photo.style.marginTop = margTop ;
 
				//var TCheminPhoto=big_photo.src.split('/');
				//var Lg=TCheminPhoto.length-1;   TCheminPhoto[Lg]
 
 
 
				big_photo.onclick=function() { ouvre('../chemin//'+big_photo.src);}
 
			  //  titre_photo.firstChild.nodeValue = this.title; 
			}); 
           return false;
        }; 
    } 
} 
 
 
//html
$Html="<div id=\"galerie\"><div class=\"Photo\" >";
 
    foreach($T as $K=>$V){
 
		$Html.="<img id=\"big_pict\"  src=\"".$V."\" title=\"Cliquer pour agrandir\" onclick=\"ouvre('../produit/popupPhoto.php?Photo=".$V."')\" alt=\"".$Name."_".$K."\" />";
 
 
			$Html.="<div id=\"PlaceMiniature\"><ul id=\"galerie_mini\">";
			$Html.="<li><a id=\"LienPhotoJs\" href=\"".$V."\"  title=\"Cliquez pour agrandir l'image\"><img src=\"".$V."\"  alt=\"".$Name."_".$K."\" /></a></li>";
		}
		else{
			$ImgRedim=redImage($V,90,60);
			$Html.="<li><a id=\"LienPhotoJs\" href=\"".$V."\" title=\"Cliquez pour agrandir l'image\"><img src=\"".$V."\"  alt=\"".$Name."_".$K."\" /></a></li>";
		}
	}
	$Html.="</ul></div></div></div>";
 
	return $Html;		
 
}

J'avoue etre un peu perdu dans toutes ces reponse. Dois je me diriger vers la reponse de Gatsu35 ? Avec un pb de chargement du js avant le html ?

17/02/2010, 14h12
andry.aime

Bonjour
Tu auras un id qui se répètent avec ton code. Un id doit être unique dans un document.
17/02/2010, 14h13
andry.aime

Donne nous le HTML généré mais pas le code PHP.

le code html :-)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<div id="galerie">
<div class="Photo" >
           <img id="big_pict" style="WIDTH:203px; HEIGHT:300px;margin-left:48.5px;margin-top:0px;" src="../produit/fiche_images/sacBucheA300.jpg" title="Cliquer pour agrandir" onclick="ouvre('../produit/popupPhoto.php?Photo=../produit/fiche_images/sacBucheA300.jpg')" alt="SAC A BUCHES JUTE_0" />
 
<div id="PlaceMiniature">
<ul id="galerie_mini"><li>
<a id="LienPhotoJs" href="../produit/fiche_images/sacBucheA300.jpg"  title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sacBucheA300.jpg" style="WIDTH:41px; HEIGHT:60px;margin-left:28.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_0" /></a></li>
 
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/sacBucheB300.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sacBucheB300.jpg" style="WIDTH:45px; HEIGHT:60px;margin-left:26.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_1" />
</a>
</li>
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/SABchocolat.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/SABchocolat.jpg" style="WIDTH:85px; HEIGHT:60px;margin-left:6.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_2" />
</a>
</li>
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/sac-buche-jute-rouge-R.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sac-buche-jute-rouge-R.jpg" style="WIDTH:90px; HEIGHT:60px;margin-left:4px;margin-top:5px;" alt="SAC A BUCHES JUTE_3" />
</a>
</li>
</ul>
</div>

Je charge mon js en haut de page avec un appel a un fichier

Citation:

Envoyé par guigo

le code html :-)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<div id="galerie">
<div class="Photo" >
           <img id="big_pict" style="WIDTH:203px; HEIGHT:300px;margin-left:48.5px;margin-top:0px;" src="../produit/fiche_images/sacBucheA300.jpg" title="Cliquer pour agrandir" onclick="ouvre('../produit/popupPhoto.php?Photo=../produit/fiche_images/sacBucheA300.jpg')" alt="SAC A BUCHES JUTE_0" />
 
<div id="PlaceMiniature">
<ul id="galerie_mini"><li>
<a id="LienPhotoJs" href="../produit/fiche_images/sacBucheA300.jpg"  title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sacBucheA300.jpg" style="WIDTH:41px; HEIGHT:60px;margin-left:28.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_0" /></a></li>
 
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/sacBucheB300.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sacBucheB300.jpg" style="WIDTH:45px; HEIGHT:60px;margin-left:26.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_1" />
</a>
</li>
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/SABchocolat.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/SABchocolat.jpg" style="WIDTH:85px; HEIGHT:60px;margin-left:6.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_2" />
</a>
</li>
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/sac-buche-jute-rouge-R.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sac-buche-jute-rouge-R.jpg" style="WIDTH:90px; HEIGHT:60px;margin-left:4px;margin-top:5px;" alt="SAC A BUCHES JUTE_3" />
</a>
</li>
</ul>
</div>

Je charge mon js en haut de page avec un appel a un fichier

file nous l'appel à la fonction JS displayPics()
tu l'appelles quand et COMMENT cette fonction ?

17/02/2010, 14h29
guigo
Code:

1 2 window.onload = displayPics;
Je l'appel dans mon fichier js avec le code ci-dessus

Ah oui je precise aussi que j'ai ajouté l'id pour tenter un getelementById...
Mais c'est vrai que l'id ce repete la...Mais si je passe par getElementsByTagName je doit normalement pouvoir retirer l'id des balise a?
17/02/2010, 15h45
andry.aime

Suite a mon ancien remarque, je trouve encore ca dans ton code

Citation:

<a id="LienPhotoJs" href="../produit/fiche_images/sacBucheA300.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sacBucheA300.jpg" style="WIDTH:41px; HEIGHT:60px;margin-left:28.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_0" /></a></li>

<li>
<a id="LienPhotoJs" href="../produit/fiche_images/sacBucheB300.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/sacBucheB300.jpg" style="WIDTH:45px; HEIGHT:60px;margin-left:26.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_1" />
</a>
</li>
<li>
<a id="LienPhotoJs" href="../produit/fiche_images/SABchocolat.jpg" title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/SABchocolat.jpg" style="WIDTH:85px; HEIGHT:60px;margin-left:6.5px;margin-top:5px;" alt="SAC A BUCHES JUTE_2" />
</a>

oups je modifie tout de suite et je poste de nouveau.
Juste pour etre bien sur puis je utilisiser getElementsByTagName sans generer d'erreur ou suis je obliger de passer par un id ?

Toutes mes excuses pour les post precedent

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
 
<div id="galerie">
<div class="Photo" >
<img id="big_pict" style="WIDTH:157px; HEIGHT:300px;margin-left:71.5px;margin-top:0px;" src="../produit/fiche_images/NCA1180.jpg" title="Cliquer pour agrandir" onclick="ouvre('../produit/popupPhoto.php?Photo=../produit/fiche_images/NCA1180.jpg')" alt="MEUBLE CAVE ET PLATEAU_0" />
 
<div id="PlaceMiniature">
<ul id="galerie_mini">
<li>
<a  href="../produit/fiche_images/NCA1180.jpg"  title="Cliquez pour agrandir l'image"><img src="../produit/fiche_images/NCA1180.jpg" style="WIDTH:31px; HEIGHT:60px;margin-left:33.5px;margin-top:5px;" alt="MEUBLE CAVE ET PLATEAU_0" /></a>
</li>
</ul>
</div>
</div>
</div>

17/02/2010, 16h09
guigo

Bon je suis un boulet :-(
Ma fonction js est faite uniquement pour une de mes page. Mais je l'appelais constament puisque je charger l'intégralité de mon fichier (contenant la fct) pour toutes les pages.... La valeur de liens = photos.getElementsByTagName('a'); etait donc forcement null !

:ccool: merci a tous pour les réponses apportées.
Toutes mes excuses pour ce manque de réflexion !