Bonjour,

Voila je rencontre un petit problème avec mon code.

Ce que je fais

Je veux creer sur mon site (un reseau social) un systeme de bouton like/dislike dynamique en javascript. J'ai reussit en quelque sorte avec du php et js, mais j'ecris trop de code pour rien et je veux simplifier mon code avec Jquery en enlevant et ajoutant une classe à chaque clic. Voici mon code html. J'utilise la librairie css de foudation

<div id="like"><i class="fi-like like" id="1" style="font-size:35px;color:black;padding-left:3em">0</i></div>

Ce que je veux

Je veux que le nombre s'incremente et se decremente automatiquement entre 0 et 1 à chaque fois qu'on clic. Voici mon Js

<script>
$(document).ready(function(){
    $('.like').on("click",function(){
                        $like=$(this);
                        $id=$like.attr('id');
                        num=parseInt(($like).text());
                        $like.text(num+1);
                        $jaime=$('#like');
                        $jaime.find(".fi-like").removeClass('like');
                })}         
            </script>

Ce que j'obtiens

Lorsque je continus à clic sur le bouton qui contient la classe like mon chiffre continus à s'incrementer, ce qui veut dire que la classe n'a pas été remové. Besoin d'aide

4 réponses


Anthony_
Auteur
Réponse acceptée

J'ai trouvé la solution, je met donc ce sujet en resolu. @Kaelyscius, merci cela m'a aussi été utile.

Salut,

As-tu suivi le tutoriel de @Grafikart consacré au système de like/dislike ?

Anthony_
Auteur

Oui mais j'aimerai aussi tester mon code, votre aide sera la bienvenue

Hello,

Pour moi il y a une erreur de logique, tu fais :

$jaime=$('#like');

Pourquoi tu ne fais pas un truc comme ça ?

<script>
$(document).ready(function(){
//on cherche le parent de l'élément
    $('#like').on("click",function(){
                        // utilisation du var pour limiter la portée des variables
                        var like=$(this).find('.like');
                       //ton traitement
                })}         
</script>

Il est plus logique et aussi moins galère de gérer un élément parent et de chercher des éléments enfants, pour effectuer un traitement.

J'espère que cela pourra t'aider