Besoin d'aide pour un OnClick

Par Ty Malib, il y a 8 ans


Bonsoir,

J'ai un petit soucis, je ne suis pas très calé en JS je débute véritablement en utilisant quelques options dans le jeu que je code.
Ce que j'essai de faire :

J'ai 5 factions dans le jeu, coalition, independant, legion, mercenaire, rebelle. Dans une page faction j'affiche les logos de chaques factions et une description suivi d'un bouton rejoindre.

Je voulais faire en sorte que dès que l'on clique sur un logo la description et le bouton apparraissent dans l'encadré en dessous.
Si on clic sur une autre banniere même chose mais elle prend la même position ( se trouve au même endroit) que la description précédente et l'autre disparait. J'ai essayé plusieurs méthode mais rien à faire.

Je demande donc votre aide pour réussir.

Voici le code un peu fouilli :

<div class="fond_liste_faction"> <div class="emplacement_banniere"> <button class="coalition_logo" id="coalition" onclick="show('<?php echo $faction_desc['coalition'] ?>')"></button> <button class="independant_logo" id="independant" onclick="show('<?php echo $faction_desc['independant'] ?>')"></button> <button class="rebelle_logo" id="rebelle" onclick="show('rebelle')"></button> <button class="mercenaire_logo" id="mercenaire" onclick="show('mercenaire')"></button> <button class="legion_logo" id="legion" onclick="show('legion')"></button> </div> <div class="cadre_form_faction"> <div class="selection_faction">CLIQUEZ SUR LES LOGOS DES FACTIONS POUR AFFICHER LES HISTOIRES DES FACTIONS</div> <div class="emplacement_formulaire_faction"> </div> </div> <div class="texte_faction_js"> <div id="texte_modif"> <div class="texte_coalition"> <div class="bouton_faction"> <form action="<?php echo pathPhp(); ?>faction/traitement_faction.php" method="post"> <input type="hidden" name="coalition" value="coalition"/> <input class="bouton_orange" type="submit" value="Coalition"></input> </form> </div> </div> <div class="texte_independant" > <div class="bouton_faction"> <form action="<?php echo pathPhp(); ?>faction/traitement_faction.php" method="post"> <input type="hidden" name="independant" value="independant"/> <input class="bouton_orange" type="submit" value="Independant"></input> </form> </div> </div> <div class="texte_rebelle" > <div class="bouton_faction"> <form action="<?php echo pathPhp(); ?>faction/traitement_faction.php" method="post"> <input type="hidden" name="rebelle" value="rebelle"/> <input class="bouton_orange" type="submit" value="Rebelle"></input> </form> </div> </div> <div class="texte_mercenaire" > <div class="bouton_faction"> <form action="<?php echo pathPhp(); ?>faction/traitement_faction.php" method="post"> <input type="hidden" name="mercenaire" value="mercenaire"/> <input class="bouton_orange" type="submit" value="Mercenaire"></input> </form> </div> </div> <div class="texte_legion" > <div class="bouton_faction"> <form action="<?php echo pathPhp(); ?>faction/traitement_faction.php" method="post"> <input type="hidden" name="legion" value="legion"/> <input class="bouton_orange" type="submit" value="Legion"></input> </form> </div> </div> </div> </div> </div> <script> function show(id){ var p = document.getElementById("texte_modif") p.textContent = id; } </script>

Cordialement,

6 réponses

Psylozoff, il y a 8 ans

Wow, y'a beaucoup à dire...

Premièrement, indente ton code!! Sinon c'est dégueulasse -_-

Deuxièmement, déclare les constantes une seule fois! (p)

Troisièmement, <?php echo "text"; ?> est équivalent à <?="text" ?>

Quatrièmement, tu veux vraiment supprimer tout ce que ta div contient..??

Ty Malib, il y a 8 ans

Oui il est fouilli le code vu que je tatonne ;)
J'ai pas compris le 4em?

Ty Malib, il y a 8 ans

Une petite explication ? car même en lisant je ne saisie pas tout ....

Psylozoff, il y a 8 ans

Qu'est-ce que tu ne comprends pas? Poses des questions précises et je répondrais ;-p

Huggy, il y a 8 ans

Il vaudrait mieux créer une DIV vide au même niveau que tes boutons
tu la remplis avec textContent
Pour les boutons tu peux les cacher en leur affectant une classe qui les display: none
tu peux ensuite basculer la classe par la méthode toggle