Bonjour, voila mon problème: J'ai une fonction javascript qui fonctionne dans mon fichier html sous cette forme:
Mais elle ne fonctionne pas sous cette forme:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5 function fonction(){ var param1; var param2; // Instructions.... }
Pourtant dans un autre fichier html j'utilise une fonction de ce type (function fonction(param1, param2)) assez proche et elle marche.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6 var param1; var param2; function fonction(param1, param2){ //Instructions... }
Je ne comprend pas pourquoi :D .
Le fichier HTML qui marche:
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 <!DOCTYPE html> <head> <link rel = "stylesheet" type = "text/css" href = "kappa.css"> <script src = "kappa.js" defer></script> </head> <body onload = "dessinerBoutonCo(boutonCo, canvasBoutonCo);"> <a href = "utilisateur.html"> <canvas id = "boutonConnexion" width = "250px" height = "200px" onmouseover = "changerBoutonCo(boutonCo, canvasBoutonCo);" onmouseout = "dessinerBoutonCo(boutonCo, canvasBoutonCo);"> </canvas> </a> </body> </html>
Le fichier javaScript asocié:Le fichier html qui ne marche pas:
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
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 var canvasBoutonCo = document.getElementById("boutonConnexion"); var boutonCo = canvasBoutonCo.getContext("2d"); var canvasBoutonRe = document.getElementById("boutonRecherche"); var boutonRe = canvasBoutonRe.getContext("2d"); function dessinerBoutonCo(boutonCo, canvasBoutonCo){ // Marche var gradient = boutonCo.createLinearGradient(50, 10, 160, 160); boutonCo.clearRect(0, 0, canvasBoutonCo.width, canvasBoutonCo.height); boutonCo.beginPath(); boutonCo.arc(140, 100, 90, 0, 2 * Math.PI); boutonCo.fillStyle = "#B3B7B3"; boutonCo.fill(); boutonCo.fillStyle = "white"; boutonCo.textBaseline = "top"; boutonCo.font = "bold 27px serif"; boutonCo.fillText("Connexion", 80, 85); boutonCo.beginPath(); boutonCo.arc(140, 100, 91, 0, 2 * Math.PI); gradient.addColorStop("0", "#1F002D"); gradient.addColorStop("1", "#8133A1"); boutonCo.strokeStyle = gradient; boutonCo.lineWidth = 3; boutonCo.stroke(); } function changerBoutonCo(boutonCo, canvasBoutonCo){ // Marche var gradient = boutonCo.createLinearGradient(50, 10, 160, 160); boutonCo.clearRect(0, 0, canvasBoutonCo.width, canvasBoutonCo.height); boutonCo.beginPath(); boutonCo.arc(140, 100, 95, 0, 2 * Math.PI); boutonCo.fillStyle = "#E6E6E6"; boutonCo.fill(); boutonCo.fillStyle = "#1F002D"; boutonCo.textBaseline = "top"; boutonCo.font = "bold 27px serif"; boutonCo.fillText("Connexion", 80, 85); boutonCo.beginPath(); boutonCo.arc(140, 100, 96, 0, 2 * Math.PI); gradient.addColorStop("0", "#1F002D"); gradient.addColorStop("1", "#8133A1"); boutonCo.strokeStyle = gradient; boutonCo.lineWidth = 3; boutonCo.stroke(); } //[...] function dessinerBoutonRe(boutonRe, canvasBoutonRe){ // Ne marche pas, mais marche si je declare les variables dans la fonction plutot que de les passer par parametres. boutonRe.clearRect(0, 0, canvasBoutonRe.width, canvasBoutonRe.height); boutonRe.fillRect(10, 10, 10, 10); }
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10 <!DOCTYPE html> <head> <link rel = "stylesheet" type = "text/css" href = "kappa.css"> <script src = "kappa.js" defer></script> </head> <body onload = "dessinerBoutonRe(boutonRe, canvasBoutonRe);"> <canvas id = "boutonRecherche" width = "30" height = "30"> </canvas> </body> </html>
J'ai l'impression de faire la même chose dans les deux cas mais la fonction dessinerBoutonRe(param1, param2) qui est appelé dans mon second .html ne fonctionne pas alors quelle fonctionne sous la forme
dessinerBoutonRe(){ var param1; var param2...}.
Je dois certainement passé à coté de quelque chose que je ne vois pas.
Merci d'avance pour votre aide.
Partager