getElementById ne fonctionne pas

Version imprimable

Bonjour à tous,
j'ai un souci qui me prend la tête depuis le début de la matinée avec mon javascript. Pourtant le code est très simple, mais je comprend pas pourquoi ça marche pas ! :evilred:
Le code que je veux mettre dans ma page n'est pas vraiment celui-ci mais même celui que je joint à ce message ne fonctionne pas.
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 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Document sans nom</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script type="text/javascript"> function messagealert() { alert("Message Alerte"); } document.getElementById("image").onclick=messagealert; </script> </head> <body> <img id="image" src="image.jpg"> </body> </html>
Au niveau évènement, quand c'est moi qui écrit, rien ne fonctionne, j'ai essayé pleins de choses, quand je recopie le code de tutoriaux ça ne fonctionne pas non plus... :aie: c'est dingue !

Pourriez-vous m'aidé s'il vous plait parce que je ne trouve rien à ce sujet.
Merci

15/01/2008, 12h02
yamayo

Salut salut,
Au moment où tu déclare le comportement de l'événement onclick ton image n'est pas chargé!
Les éléments de ta page se charge dans l'ordre...
Tu peux attribuer tes événenements lorsque survient l'événement onload par exemple.
15/01/2008, 12h06
mokadjo
D'accord, alors ça veut dire que je doit mettre quelque chose comme ça ?
Code:

1 2 3 4 5 6 7 document.onload=function(){ function messagealert() { alert("Message Alerte"); } document.getElementById("image").onclick=messagealert; }
Mais ça ne fonctionne pas chez moi

(merci pour ta réponse)

+1 je viens de tester c'est ca.

Ca marche en mettant le script apres le body ou en utilisant l'événement onload du body.

Pour t'en convaincre il suffit d'executer :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Document sans nom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function messagealert()
{
alert("Message Alerte");
}
alert("AVANT : " + document.getElementById('image'));
</script>
</head>
 
<body onload="alert('LOAD');document.getElementById('image').onclick=messagealert;">
<img id="image" src="http://www.developpez.net/forums/image.php?u=547&dateline=1199956743"/>
</body>
<script type="text/javascript">
alert("APRES : " + document.getElementById('image'));
</script>
</html>

15/01/2008, 12h12
E.Bzz

Bonjour,

Citation:

Envoyé par yamayo

Les éléments de ta page se charge dans l'ordre...

Non, c'est juste que l'ordre de chargement n'est ni prévisible, ni maîtrisable ...

Citation:

Envoyé par yamayo

Tu peux attribuer tes événenements lorsque survient l'événement onload par exemple.

Là oui, car il ne se déclenche justement que quand tous les éléments sont chargés (quelque soit l'ordre)

A+
15/01/2008, 12h18
mokadjo

D'accord. Alors j'ai fait plusieurs essais, mais comment faut-il que je fasse pour pointer sur body et remplacer :

Code:

<body onload="alert('LOAD');document.getElementById('image').onclick=messagealert;">

Juste avec document.onload ?
15/01/2008, 12h28
E.Bzz
Citation:

Envoyé par mokadjo

D'accord. Alors j'ai fait plusieurs essais, mais comment faut-il que je fasse pour pointer sur body et remplacer :

Code:

<body onload="alert('LOAD');document.getElementById('image').onclick=messagealert;">

Juste avec document.onload ?

Ce n'est document.onload, mais window.onload
Dans la partie <head>
Code:

1 2 3 4 window.onload=function () { alert('LOAD'); document.getElementById('image').onclick=messagealert; }
A+
15/01/2008, 12h29
mokadjo

En fait ma question c'est plutôt : comment puis-je faire pour définir des évènements une fois que tout est chargé (du coup).
Si par exemple je veux mettre tout mon jvscript dans un .js et que je ne veux pas que ça apparaisse dans mon html
15/01/2008, 12h31
mokadjo
Citation:
Envoyé par E.Bzz

Ce n'est document.onload, mais window.onload
Dans la partie <head>

Code:

1 2 3 4 window.onload=function () { alert('LOAD'); document.getElementById('image').onclick=messagealert; }

A+
Ok (excuse moi j'suis un peu lent à la rédaction, j'ai du mal à percuter aujourd'hui :D)
Merci beaucoup les gars, je commençais à m'arracher les cheveux !
A+
15/01/2008, 12h31
E.Bzz

Citation:

Envoyé par mokadjo

En fait ma question c'est plutôt : comment puis-je faire pour définir des évènements une fois que tout est chargé (du coup).

Pareil ;)

Citation:

Si par exemple je veux mettre tout mon jvscript dans un .js et que je ne veux pas que ça apparaisse dans mon html

Heu ... ça par contre ça n'a rien à voir :?

A+
15/01/2008, 12h32
mokadjo

Citation:

Envoyé par E.Bzz

Pareil ;)
Heu ... ça par contre ça n'a rien à voir :?

C'est à dire ?
15/01/2008, 12h35
E.Bzz

Citation:

Envoyé par mokadjo

C'est à dire ?

C'est à dire que, externalisé (dans un .js) ou intégré à ta page, il n'y a aucune influence sur le comportement du code Javascript.
Bref : ça ne change rien, le code est chargé/exécuté comme s'il était dans le <head> de ta page ...

A+
15/01/2008, 12h40
mokadjo

En fait j'voulais juste ne pas définir les évènements à l'intérieur des balises html, donc du coup avec window.onload c'est nickel !
Merci encore à vous deux :king: