Modifier class span
Résolu/Fermé
A voir également:
- Modifier class span
- Modifier liste déroulante excel - Guide
- Modifier dns - Guide
- Comment modifier un pdf - Guide
- Modifier story facebook - Guide
- Modifier sa voix en direct - Guide
4 réponses
Nexii
Messages postés
338
Date d'inscription
jeudi 13 mars 2014
Statut
Membre
Dernière intervention
14 mars 2017
570
26 nov. 2015 à 11:34
26 nov. 2015 à 11:34
Bonjour,
Vous n'agissez pas sur le bon élément.
- Premièrement fermez correctement vos balises <span> et <li>.
- Ensuite il faut donc que la fonction soit déclarer dans une méthode onload (document ready avec jQuery).
Voici le code :
Vous n'agissez pas sur le bon élément.
- Premièrement fermez correctement vos balises <span> et <li>.
- Ensuite il faut donc que la fonction soit déclarer dans une méthode onload (document ready avec jQuery).
Voici le code :
$( document ).ready(function() { // On cible le span $('#list li .glyphicons').click(function() { // Retire la class "star" $(this).toggleClass( "star" ); // Ajoute la classe "dislikes" $(this).toggleClass( "dislikes" ); }); });
jordane45
Messages postés
38285
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2024
4 697
26 nov. 2015 à 11:12
26 nov. 2015 à 11:12
Bonjour,
Et que donne ceci :
Et que donne ceci :
$('#list').on('click', 'li', function() { var id = $(this).attr('id'); $("#"+id).toggleClass('glyphicons star'); $("#"+id).toggleClass('glyphicons dislikes'); });
jordane45
Messages postés
38285
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
13 novembre 2024
4 697
>
samy
26 nov. 2015 à 11:36
26 nov. 2015 à 11:36
Au pire , fais un REMOVE ADD
Par exemple :
Par exemple :
var classToRemove; var classToAdd ; if( $('#'+id).hasClass('glyphicons star')){ classToRemove = 'glyphicons star'; classToAdd = 'glyphicons dislikes'; }else{ classToRemove = 'glyphicons dislikes'; classToAdd = 'glyphicons star'; } $("#"+id).removeClass(classToRemove); $("#"+id).toggleClass(classToAdd);
Pitet
Messages postés
2826
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
21 juillet 2022
525
Modifié par Pitet le 26/11/2015 à 11:35
Modifié par Pitet le 26/11/2015 à 11:35
Salut,
Plusieurs remarques :
- le code html n'est pas correct, les balises span .from et li ne sont pas fermées
- dans le code javascript, il faut cibler le span qui possède la classe .glyphicons, pour l'instant tu cible la balise li
- sauf erreur de ma part, les classes glyphicons doivent être écrites sous la forme "glyphicons glyphicons-star"
Soit :
Bonne journée
Plusieurs remarques :
- le code html n'est pas correct, les balises span .from et li ne sont pas fermées
- dans le code javascript, il faut cibler le span qui possède la classe .glyphicons, pour l'instant tu cible la balise li
- sauf erreur de ma part, les classes glyphicons doivent être écrites sous la forme "glyphicons glyphicons-star"
Soit :
<ul class="messagesList" id="list"> <li id="454"><span class="from"><span id="454" class="glyphicons glyphicons-star"></span></span></li> <li id="453"><span class="from"><span id="453" class="glyphicons glyphicons-star"></span></span></li> <li id="452"><span class="from"><span id="452" class="glyphicons glyphicons-star"></span></span></li> <li id="451"><span class="from"><span id="451" class="glyphicons glyphicons-star"></span></span></li> </ul>
$('#list').on('click', 'li', function() { var span = $('.glyphicons', this); // on cible la balise avec la classe .glyphicons dans la balise li cliquée (this) span.toggleClass('glyphicons-star'); span.toggleClass('glyphicons-dislikes'); });
Bonne journée