<a href> dynamique inopérant

Version imprimable

Bonsoir,

Voilà j'ai créé un petit script JS pour remplir une div sur un clic sur image, pas de soucis à ce niveau là. Cependant, dans cette div je mets une image qui pourra elle être cliquable et devra pointé vers un lien externe. Cependant mon <a href... > ne fonctionne pas et je ne comprends pas pourquoi !

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
var liste = document.createElement("P");
var elemP = document.createElement("P");
var elemPC = document.createElement("P");
var elemA = document.createElement("A");
 
 
elemPC.setAttribute("style","padding-left:250px");
elemA.setAttribute("href","http://www.google.fr/");
 
 
var elemIMG = document.createElement("img");
 
elemP.appendChild(document.createTextNode("Notre nouvelle prestation d'assistance informatique vous assure un dépannage très rapide !"));
elemP.appendChild(document.createElement('br'));
elemP.appendChild(document.createElement('br'));
elemP.appendChild(document.createTextNode("Le tarif horraire des prestations de dépannage sont de 33€ TTC"));
elemP.appendChild(document.createElement('br'));
elemP.appendChild(document.createElement('br'));
elemP.appendChild(document.createElement('br'));
elemPC.appendChild(document.createTextNode("Une question ? N'hésitez pas à nous contacter !"));
elemP.appendChild(document.createElement('br'));
elemP.appendChild(document.createElement('br'));
 
elemIMG.setAttribute("src","img/mail_tarifs.png");
elemIMG.setAttribute("style","width:100px; height:100px");
 
 
elemA.appendChild(elemIMG);
 
liste.appendChild(elemA);
liste.appendChild(elemIMG);
 
 
document.getElementById("description_ordi").appendChild(liste);

Merci bien ! :D

Code:

1
2
3
 
elemIMG.src="img/mail_tarifs.png";
elemA.href="http://www.openeyes.fr";

etc ...

Ok voici mes changements mais ce coup ci ça ne fonctionne plus du tout !

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
var liste = document.createElement("P");
					var elemP = document.createElement("P");
					var elemPC = document.createElement("P");
					var elemA = document.createElement("A");
 
					var elemIMG = document.createElement("img");
 
					elemP.appendChild(document.createTextNode("Notre nouvelle prestation d'assistance informatique vous assure un dépannage très rapide !"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createTextNode("Le tarif horraire des prestations de dépannage sont de 33€ TTC"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemPC.appendChild(document.createTextNode("Une question ? N'hésitez pas à nous contacter !"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
 
					elemIMG.src="img/mail_tarifs.png";
					elemIMG.style="width:100px; height:100px";
 
					elemA.href="http://www.openeyes.fr";
 
					elemA.appendChild(elemIMG);
 
					liste.appendChild(elemA);
					liste.appendChild(elemIMG);
 
 
					document.getElementById("description_ordi").appendChild(liste);

Merci bien !

09/08/2010, 22h41
Invité
tu inserre l'image dans la balise a href j'usqu'ici tout va bien mais deux lignes apres tu réinserre l'image dans liste a mon avis le probleme vient de la
Code:

1 2 3 4 5 elemA.appendChild(elemIMG); liste.appendChild(elemA); liste.appendChild(elemIMG);

Ah oui effectivement, ayant la tête dans le guidon je ne l'ai pas vu ce qui est corrigé.

Mais plusieurs problèmes cependant !

Sur Safari :

Il n'y a que l'image qui s'affiche sans prendre en compte les styles définis au dessus. côté positif : le lien fonctionne :D

Sur Firefox :

Rien ne fonctionne

Revoici mon code (corrigé)

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
var liste = document.createElement("P");
					var elemP = document.createElement("P");
					var elemPC = document.createElement("P");
					var elemA = document.createElement("A");
 
					var elemIMG = document.createElement("img");
 
					elemP.appendChild(document.createTextNode("Notre nouvelle prestation d'assistance informatique vous assure un dépannage très rapide !"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createTextNode("Le tarif horraire des prestations de dépannage sont de 33€ TTC"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemPC.appendChild(document.createTextNode("Une question ? N'hésitez pas à nous contacter !"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
 
					elemIMG.src="img/mail_tarifs.png";
					elemIMG.style="width:100px; height:100px";
 
					elemA.href="http://www.openeyes.fr";
 
					elemA.appendChild(elemIMG);
 
					liste.appendChild(elemA);					
 
					document.getElementById("description_ordi").appendChild(liste);

10/08/2010, 08h33
SpaceFrog
ça vient de ton attribution de style..

Code:

elemIMG.style="width:100px; height:100px";

:nono:

Code:

elemIMG.style.cssText="width:100px; height:100px";

ou
Code:

1 2 elemIMG.style.width="100px" elemIMG.style.height="100px";
et accessoirement ceci ne gène en rien le code, mais me froisse les yeux !!!

Citation:

Le tarif horraire des prestations de dépannage sont de 33€ TTC

serait BEAUCOUP MIEUX comme ceci:

Citation:

Le tarif horaire des prestations de dépannage est de 33€ TTC

et pour régler l'insertion de l'image:

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
					var myliste = document.createElement("p");
					var elemP = document.createElement("p");
					var elemPC = document.createElement("p");
 
 
					elemP.appendChild(document.createTextNode("Notre nouvelle prestation d'assistance informatique vous assure un dépannage très rapide !"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createTextNode("Le tarif horaire des prestations de dépannage est de 33€ TTC"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
					elemPC.appendChild(document.createTextNode("Une question ? N'hésitez pas à nous contacter !"));
					elemP.appendChild(document.createElement('br'));
					elemP.appendChild(document.createElement('br'));
 
					var elemA = document.createElement('a');
 
					var elemIMG = new Image();
					elemIMG.src="img/1.png"
					elemIMG.style.cssText="width:100px; height:100px";
					elemA.style.display="block";
					elemA.href="http://www.openeyes.fr";
					elemA.appendChild(elemIMG)
					myliste.appendChild(elemP);
					myliste.appendChild(elemA);
 
 
 
					document.getElementById("description_ordi").appendChild(myliste);

10/08/2010, 11h17
googlemania

Merci à tous !

Je vais pouvoir enfin mettre à jour mon site qui avait pris un coup de vieu ! ;)

Mea Culpa pour avoir froissé des yeux ! :)