Alors, j'ai depuis peu commencer un projet d'un jeu en PHP+Mysql avec un peu de javascript (surtout un peu car je sais pas tellement en faire faute d'apprentissage lors de mes deux années de bts informatique ) .
Dans le cadre du jeu, chaque héros possède un inventaire avec un certains nombre d'objet. Chaque objet à plusieurs attribut comme le nom,ses effets, et surtout la description (vous allez comprendre d'ou viens le surtout).
Alors voila, j'arrive parfaitement à afficher l'inventaire de mon personnage mais l'affichage de la ou des descriptions me pose problème, explication : J'avais d'abord simplement utiliser la méthode $_GET pour réactualiser la page et ainsi, via une fonction toute bete qui chercher la description de l'objet, afficher ma description. Le problème avec cette méthode c'est que pour chaque clique sur un objet on doit recharger entièrement la page...et donc...j'aimerais faire mieux que ca. On ma suggerer la solution suivante, en utilisant javascript et php :
- 1) Faire une fonction qu'on lance à l'évènement onLoad pour Remplir un tableau avec les descriptions des objets ( sour le format tab[id de l'objet dans ma table] = description de l'objet )
- 2) Utiliser ce tableau dans les évènements OnClick sur mes images pour faire changer le texte dans une division ( <img src='$src' OnClick='AfficheTab(id_de_mon_objet)')
Voila, j'ai donc essayer et la première partie semble fonctionner mais pas la seconde et j'ai beau faire, je ne trouve pas le problème.
Voici les sources pour y voir plus claire :
page: index2.php
page java1.php
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
50
51
52 <? session_start(); include("./fonc/fonctions.php"); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > <head> <title>Mana'adventure</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" media="screen" type="text/css" title="Mana1" href="design.css" /> <? if($_GET['java'] == "ON") include("./fonc/java1.php"); ?> </head> <body onLoad='RemplirTab()'> <div id="page"> <? //include("./partsindex2/head.php"); connec(); include("./partsindex2/menu.php"); ?> <div id="corps"> <? switch($_GET['page']) { case "etat": default: include("./status.php"); break; } ?> </div> <? //include("./partsindex2/foot.php"); mysql_close(); ?> </div> </body> </html>
page status.php
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 <script Language="JavaScript"> var tab = new array(); function RemplirTab() //a lancer au chargement de la page { int id; <? connec(); $reponse = mysql_query("SELECT * FROM madv_equipements WHERE 1"); while($equip = mysql_fetch_array($reponse)) { $des = $equip['description']; ?>tab[<? echo $equip['ID'];?>] ='<? echo $des; ?>';<? } ?> } function test() { alert("test"); } function AfficheTab(j) //a lancer a OnClick de l'image { document.getElementById("description").innerHTML="<i>"+tab[j]+"</i>"; <? echo "fokkk"; ?> } </script>
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126 <? $infox = GetPlayerHeros($_SESSION['log']); $barres[0] = $infox['hp/hpmax']; $barres[1] = $infox['mp/mpmax']; $barres[2] = $infox['ap']; $barres[3] = $infox['xp/xpneeded']; //echo "<img src=".$infox['img']." class='imagejob'>"; echo "<div>"; echo "<table id='mytablefiche' width='400' cellspacing='0' border='0'>"; echo "<tr id='tr_color' ><td colspan='4' align='center'>".$_SESSION['log']."</td></tr>"; ?> <tr> <td width="10%" rowspan="4" align="center"><img src=<?=$infox['img'];?>></td> <td width="25%" align="center"><u><b>Profession :</u></b></td> <td colspan="2" width="25%" align="center"><?echo $infox['job'];?></td> </tr> <tr> <td align="center"><u><b>Village Natal :</u></b></td> <td colspan="2" align="center"><?echo $infox['town'];?></td> </tr> <tr> <td align="center"><u><b>Position actuel:</u></b></td> <td colspan="2" align="center"><?echo $infox['position'];?></td> </tr> <tr> <td align="center"><u><b>Niveau actuel:</u></b></td> <td colspan="2" align="center"><?echo $infox['level'];?></td> </tr> <? //echo "<tr><td rowspan='4' colspan='2' align='center'><img src=".$infox['img']."></td><td colspan='1' align='left'><b>Profession :</b></td><td>".$_SESSION['job']."</td></tr>"; //echo "<tr><td colspan='2' align='left'><b>Village natal:</b></td><td colspan='2'>".$infox['town']."</td></tr>"; //echo "<tr><td colspan='2' align='center'><b>Position actuel:</b></td><td colspan='2'>".$infox['position']."</td></tr>"; //echo "<tr><td colspan='2' align='center'><b>Niveau actuel :</b></td><td colspan='2'>".$_SESSION['level']."</td></tr>"; //AfficheBarres(1,$barres,5,3); echo "<tr><td colspan='4'><hr></td></tr>"; echo "<tr><td><b>Force :</b></td><td>".$infox['str']."</td><td><b>Attaque :</b></td><td>ATK</td></tr>"; echo "<tr><td><b>Agilité :</b></td><td>".$infox['agi']."</td><td><b>Defense :</b></td><td>DEF</td></tr>"; echo "<tr><td><b>Vitalité :</b></td><td>".$infox['vit']."</td><td><b>Evasion :</b></td><td>EVA</td></tr>"; echo "<tr><td><b>Intelligence :</b></td><td>".$infox['esp']."</td><td><b>Def Magique :</b></td><td>MATK</td></tr>"; echo "<tr><td><b>Esprit :</b></td><td>".$infox['int']."</td><td><b>Atk Magique :</b></td><td>MDEF</td></tr>"; echo "<tr><td><b>Chance :</b></td><td>".$infox['luk']."</td><td><b>Précision :</b></td><td>HIT</td></tr>"; echo "</table>"; //equipement $equip = GetPlayerEquipement($_SESSION['log']); $ne = "<img src='./images/ne.gif' title='NON EQUIPE'>"; echo "<table id='mytablequip' cellspacing='0' border='0'>"; echo "<tr id='tr_color'><td align='center' colspan='3'>Equipement</td></tr>"; if($equip['arme']['effet'] != NULL) echo "<tr><td id='padding'><u>Arme :</u> <b></td><td align='center'><b>ATK+".$equip['arme']['effet']."</b></td><td align='center'> <img src=".$equip['arme']['img']." title='".$equip['arme']['name']."'> </td></tr>"; else echo "<tr><td id='padding'><u>Arme :</u> <b></td><td align='center'><b> N/E </b></td><td align='center'>$ne</td></tr>"; if($equip['casque']['effet'] != NULL) echo "<tr><td id='padding'><u>Casque :</u> <b></td><td align='center'><b>DEF+".$equip['casque']['effet']."</b></td><td align='center'> <img src=".$equip['casque']['img']." title='".$equip['casque']['name']."'> </td></tr>"; else echo "<tr><td id='padding'><u>Casque :</u> <b></td><td align='center'><b>N/E</b></td><td align='center'>$ne </td></tr>"; if($equip['armure']['effet'] != NULL) echo "<tr><td id='padding'><u>Armure :</u> <b></td><td align='center'><b>DEF+".$equip['armure']['effet']."</b></td><td align='center'> <img src=".$equip['armure']['img']." title='".$equip['armure']['name']."'> </td></tr>"; else echo "<tr><td id='padding'><u>Armure :</u> <b></td><td align='center'><b> N/E</b></td><td align='center'>$ne </td></tr>"; if($equip['bouclier']['effet'] != NULL) echo "<tr><td id='padding'><u>Bouclier :</u> <b></td><td align='center'><b>DEF+".$equip['bouclier']['effet']."</b></td><td align='center'> <img src=".$equip['bouclier']['img']." title='".$equip['bouclier']['name']."'> </td></tr>"; else echo "<tr><td id='padding'><u>Bouclier :</u> <b></td><td align='center'><b>N/E</b></td><td align='center'>$ne </td></tr>"; //echo "<tr><td id='padding'><u>Bottes :</u> <b></td><td><b>Defense+".$equip['pied']['effet']."</b></td><td align='center'> <img src=".$equip['pied']['img']." title='".$equip['pied']['name']."'> </td></tr>"; $acc1 = explode(";",$equip['acc1']['effet']); $effetacc1 = "DEF+".$acc1[0]." MDEF+".$acc1[1]; $acc2 = explode(";",$equip['acc2']['effet']); $effetacc2 = "DEF+".$acc2[0]." MDEF+".$acc2[1]; if($equip['acc1']['effet'] != NULL) echo "<tr><td id='padding'><u>Acc1 :</u> <b></td><td align='center'><b>".$effetacc1."</b></td><td align='center'> <img src=".$equip['acc1']['img']." title='".$equip['acc1']['name']."'> </td></tr>"; else echo "<tr><td id='padding'><u>Acc1 :</u> <b></td><td align='center'><b>N/E</b></td><td align='center'>$ne </td></tr>"; if($equip['acc2']['effet'] != NULL)echo "<tr><td id='padding'><u>Acc2 :</u> </td><td align='center'><b>".$effetacc2."</b></td><td align='center'> <img src=".$equip['acc2']['img']." title='".$equip['acc2']['name']."'> </td></tr>"; else echo "<tr><td id='padding'><u>Acc2 :</u> </td><td align='center'><b>N/E</b></td><td align='center'> $ne </td></tr>"; echo "</table>"; echo "<br></div><br>"; $inventaire = GetPlayerInventaire($log); echo "<table id='mytableinv' width='100%' cellspacing='0' border='1'>"; echo "<tr id='tr_color'><td align='center' colspan='100'>Inventaire</td></tr>"; echo "<tr><td colspan=50>"; $i=0; while($i<$inventaire['nbrtypeobj']+1) { $title = $inventaire[$i]['name']."(x".$inventaire[$i]['nombre'].")"; $id = $inventaire[$i]['id']; echo "<img src=".$inventaire[$i]['img']." title='".$title."' OnClick='AfficheTab(".$id.");'>"; //echo "<script type='text/javascript'><img src=".$inventaire[$i]['img']." title='".$title."' OnClick='AfficheTabyoupi);'>"; $i++; } echo "</tr></td>"; $nbrtype = $inventaire['nbrtypeobj']+1; echo "<tr><td align='center'>Nombre d'objets au total : ".$inventaire['nombretotal']."</td><td align='center'>Nombres de différents objets : ".$nbrtype." </td></tr>"; echo "<tr><td colspan=20>"; ?> <script type="text/javascript"> document.write("<div id=\"description\">chargement ...</div>"); </script> <? echo "</td></tr>"; echo "</table>"; ?>
code de la page index2.php?page=etat&java=ON en fesant "code source de le page"
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" > <head> <title>Mana'adventure</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" media="screen" type="text/css" title="Mana1" href="design.css" /> <script Language="JavaScript"> var tab = new array(); function RemplirTab() //a lancer au chargement de la page { int id; tab[1] ='Une arme très primitive mais qui néanmoins vous aidera.';tab[2] ='Un chapeau basic. Toujours mieux que rien.';tab[3] ='Une armure en cotton pour la douce saison, peu efficace en combat.';tab[5] ='Des boucles magiques.';tab[101] ='Objet qui redonne 100hp à votre héros.';tab[102] ='Objet qui redonne 300hp à votre héros.';tab[103] ='Objet qui réssucite votre héros.'; } function test() { alert("test"); } function AfficheTab(j) //a lancer a OnClick de l'image { document.getElementById("description").innerHTML="<i>"+tab[j]+"</i>"; fokkk} </script> </head> <body onLoad='RemplirTab()'> <div id="page"> <div id='menu_gauche'><div class ='groupefirst'><center><table width='115'><tr><td align=center colspan=2><b>Thief niveau 1</b><br><u>fabseven</u></td></tr><tr><td width='100' colspan='1'><img src='./images/barregreen.JPG' width='100' height='10' title='200 / 200'></td><td width='10'>HP</td></tr><tr><td width='100' colspan='1'><img src='./images/barreblue.JPG' width='100' height='10' title='25 / 25'></td><td>MP</td></tr> <tr><td width='100' colspan='1'><img src='./images/barreyellow.JPG' width='25' height='10' title='25 / 100'></td><td>AP</td></tr><tr><td width='100' colspan='1'><img src='./images/barregray.JPG' width='75' height='10' title='75 / 100'></td><td>XP</td></tr></table></center></div><div class ='groupefirst'><div class ='casefirst'>Actions héros</div><div class ='case'><a href=index2.php?page=etat>Etat</a></div><div class ='case'><a href=index2.php?page=invetaire>Inventaire</a></div><div class ='case'><a href=index2.php?page=carte>Carte</a></div></div></div> <div id="corps"> <div><table id='mytablefiche' width='400' cellspacing='0' border='0'><tr id='tr_color' ><td colspan='4' align='center'>fabseven</td></tr> <tr> <td width="10%" rowspan="4" align="center"><img src=./images/jobs/thief.gif></td> <td width="25%" align="center"><u><b>Profession :</u></b></td> <td colspan="2" width="25%" align="center">Thief</td> </tr> <tr> <td align="center"><u><b>Village Natal :</u></b></td> <td colspan="2" align="center">Hamo Potos</td> </tr> <tr> <td align="center"><u><b>Position actuel:</u></b></td> <td colspan="2" align="center">15;15</td> </tr> <tr> <td align="center"><u><b>Niveau actuel:</u></b></td> <td colspan="2" align="center">1</td> </tr> <tr><td colspan='4'><hr></td></tr><tr><td><b>Force :</b></td><td>3</td><td><b>Attaque :</b></td><td>ATK</td></tr><tr><td><b>Agilité :</b></td><td>6</td><td><b>Defense :</b></td><td>DEF</td></tr><tr><td><b>Vitalité :</b></td><td>3</td><td><b>Evasion :</b></td><td>EVA</td></tr><tr><td><b>Intelligence :</b></td><td>3</td><td><b>Def Magique :</b></td><td>MATK</td></tr><tr><td><b>Esprit :</b></td><td>3</td><td><b>Atk Magique :</b></td><td>MDEF</td></tr><tr><td><b>Chance :</b></td><td>6</td><td><b>Précision :</b></td><td>HIT</td></tr></table><table id='mytablequip' cellspacing='0' border='0'><tr id='tr_color'><td align='center' colspan='3'>Equipement</td></tr><tr><td id='padding'><u>Arme :</u> <b></td><td align='center'><b>ATK+10</b></td><td align='center'> <img src=./images/armes/flintknife.gif title='Couteaux Silex'> </td></tr><tr><td id='padding'><u>Casque :</u> <b></td><td align='center'><b>DEF+5</b></td><td align='center'> <img src=./images/armures/leatherhat.gif title='Chapeau de cuir '> </td></tr><tr><td id='padding'><u>Armure :</u> <b></td><td align='center'><b>DEF+15</b></td><td align='center'> <img src=./images/armures/cottonkilt.gif title='Kilt de cotton'> </td></tr><tr><td id='padding'><u>Bouclier :</u> <b></td><td align='center'><b>N/E</b></td><td align='center'><img src='./images/ne.gif' title='NON EQUIPE'> </td></tr><tr><td id='padding'><u>Acc1 :</u> <b></td><td align='center'><b>DEF+2 MDEF+5</b></td><td align='center'> <img src=./images/armures/utsusemiearrings.gif title='Boucle Utsusemi'> </td></tr><tr><td id='padding'><u>Acc2 :</u> </td><td align='center'><b>N/E</b></td><td align='center'> <img src='./images/ne.gif' title='NON EQUIPE'> </td></tr></table><br></div><br><table id='mytableinv' width='100%' cellspacing='0' border='1'><tr id='tr_color'><td align='center' colspan='100'>Inventaire</td></tr><tr><td colspan=50><img src=./images/objets/bonbon.gif title='Bonbon(x5)' OnClick='AfficheTab(101);'><img src=./images/objets/chocolat.gif title='Chocolat(x2)' OnClick='AfficheTab(102);'><img src=./images/objets/coupedevie.gif title='Coupe de vie(x4)' OnClick='AfficheTab(103);'></tr></td><tr><td align='center'>Nombre d'objets au total : 11</td><td align='center'>Nombres de différents objets : 3 </td></tr><tr><td colspan=20> <script type="text/javascript"> document.write("<div id=\"description\">chargement ...</div>"); </script> </td></tr></table> </div> </div> </body> </html>
Donc, on vois bien que la partie 1 a été correctement coder et exécuter vu que les cases du tableaux sont bien remplies ( il y a des cases 101,102 et 103 mais c'est normal ( id > 100 => objets utilisables ).
Par contre, j'ai beau cliquer sur mes images, il ne se passe rien ...et on vois bien que le code
n'est pas ce qu'il devrais etre (normalement on devrais avoir une des descriptions du tableau une fois qu'on a cliquer sur l'une des images)
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2 <script type="text/javascript"> document.write("<div id=\"description\">chargement ...</div>");
On a tout simplement le code initial..
Voila, si vous avez des questions...et surtout des réponses je vous écoute.
Partager