JR Query : Impossible arreter propagation d'un évènement

Résolu/Fermé
saintache - Modifié le 18 avril 2020 à 19:55
 saintache - 19 avril 2020 à 13:06
Bonjour,

Je n’arrive pas à arrêter la propagation d’événement ou alors cela stoppe tout !

Dans mon document HTML
<div>
<p class="ligdetcarnet">blablabla</p>
<p class="ligdetcarnet">encore une ligne</p>
<p class="ligdetcarnet">et encore une autre</p>
<p class="ligdetcarnet">et ainsi de suite ...blablabla</p>
</div>


Avec le script :
$('.ligdetcarnet').click,(function(){  
  console.log("click sur detclick");
  contenudet=$('.ligdetcarnet').text();
 console.log("contenu :" + contenudet);
 });

J’ai bien les traces consoles quand je clique sur une des lignes et dans la variable contenudet le contenu de toutes les lignes bout à bout

Mon objectif : cliquer sur une des lignes pour en récupérer le contenu de la seule ligne que j’ai cliquée


Si je modifie ainsi le script :
 $('.ligdetcarnet').click,(function(e){  
  console.log("click sur detclick");
  e.stopPropagation();
  e.stopImmediatePropagation();
  
  contenudet=$('.ligdetcarnet').text();
  
   console.log("contenu :" + contenudet);
 });

je n’ai jamais rien (aucune trace console) et ceci quelque soit l’endroit où je positionne mes e.stopxxx
En fait dès que j’utilise la forme function(e) plus rien ne se passe (même sans aucune ligne e.stop)

Merci d’avance pour vos avis

EDIT : Ajout des balises de code
A voir également:

3 réponses

jordane45 Messages postés 38367 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 2 janvier 2025 4 721
Modifié le 18 avril 2020 à 19:56
Bonjour,


 $('.ligdetcarnet').click,(function(e){  
  console.log("click sur detclick");
  // e.stopPropagation(); // inutile
  // e.stopImmediatePropagation(); // inutile
  //  contenudet=$('.ligdetcarnet').text(); // faux
  var contenudet = $(this).text(); // $(this) = élément cliqué
  
   console.log("contenu :" + contenudet);
 });



1
Génial cela marche - Merci beaucoup

Une remarque : j'ai enlevé le (e) avec lequel cela ne marche pas.

Une question subsidiaire : dans quel contexte faudrait-il utiliser ces e.stopxxxxxx et pourquoi cela ne fonctionne pas avec eux ?
0
jordane45 Messages postés 38367 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 2 janvier 2025 4 721
19 avril 2020 à 09:51
Ici ce n'était pas une question de e.stopxxxxxx .. mais un problème de compréhension du fonctionnement des selecteurs...
Là tu ne ciblait pas l'élément cliqué
$('.ligdetcarnet').text();
mais TOUS les éléments ayant la class ligdetcarnet ( en gros.. tu récupérais en "boucle" le text de chaque élément...)
D'où mon remplacement par
 $(this)
;

Les stopxxxx s'utilisent par exemple lors du clic sur un lien ( pour éviter d'être redirigé et faire une fonction js à la place) ou encore sur le "submit" d'un formulaire..
0
OK j'avais bien compris avec la solution
Par contre pour les e.stopxxxx il va falloir que j'approfondisse ce n'est pas encore bien clair pour moi
En tous cas merci
0