Déterminer le parent "P" après mouseup sur un span ou font ou autre balise interne

Version imprimable

17/11/2015, 13h36
patricktoulon

Déterminer le parent "P" après mouseup sur un span ou font ou autre balise interne

bonjour a tous

je cherche le moyen de determiner le parent ou grand pere qui est un "<p>" en selectionnant ou cliquant sur le texte ou une portion de texte

exemple
<p> bonjour <i>toute</i> la <b>com</b>pagnie </p>

résultat bonjour toute la compagnie

je souhaiterais au click nimporte ou dans cette phrase ou au mouseup( selection de texte ) mettre un id au "P"

des idées?
17/11/2015, 18h50
sekaijin

lorsque tu clique sur une élément quel qu'il soit tu obtient une référence sur celui-ci

et c'et élément à un attribut .parentElement qui est sont père.
tu peux donc remonter de parent en parent pour trouver un P
le dernier parent étant le documentElement lui-même.

A+JYT
17/11/2015, 22h32
patricktoulon

re

bonsoir et merci pour le retour

oui sauf que l'evenement n'est pas déclaré car ce sont des elemts ajouté en javascript

le top serait un evement windows

j'ai bien essayé addeventlistener mais cela ne semble pas fonctionner avec les balises li,p,a,span,i,b,font
18/11/2015, 08h23
SpaceFrog

avec jquery il existe les selecteurs closest() ou parents() qui permettent de remonter la hierarchie.
Sinon tu peux juste compter sur la propagation du mouseup ...
pour ce qui est de l'attribution d'evènement sur des elements ajoutés dynamiquement il suffit en jquery d'utiliser on() par délégation

http://fiddle.jshell.net/3k0ntuoa/1/
18/11/2015, 13h44
patricktoulon

re

re
bonjour spacefrog je suis allé voir le lien il semble que ca soit ca ,l'exemple est très clair

reste a savoir si je peut manipuler le this du genre this.style.Valign='left';

purée je démarre a peine le JavaScript et je me rend compte que jquery est encore plus puissant

des ce soir je teste chez moi

merci pour le retour

re fonctionne pas en local

re
bonsoir Spacefrog

j'ai essayer et sur la page web du lien que tu a donné ca fonctionne nikel mais en local visiblement pas
Code:

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 <!DOCTYPE html> <html> <head> <meta http-equiv='content-type' content='text/html; charset=UTF-8'> <title> - jsFiddle demo</title> <style type='text/css'> </style> <script type='text/javascript'> $(function(){ var i=0; $('#add').on('click', function(){ $('#screen').append( $('<p> bonjour <i>toute</i> la <b>com</b>pagnie '+ ++i +'</p>') ) }) $('#screen').on('mouseup','p', function(){ alert($(this).html());}) }) </script> </head> <body> <input id='add' type='button' value='ajouter' /> <div id='screen'> </div> </body> </html>
une idée??? du pourquoi???

edit:

bon apres examen j'ai compris je n'ai pas le plugin jquery.js alors non en effet c'est pas bon car je doit tout avoir dans le fichier sinon oui c'est vraiment nikel ca fonctionne bien c'est domage

je suis aller donc sur le site de telechargement pour prendre le js
j'en ai profiter pour m'instruire et en fait c'est du javascript pour reprendre les terme du tutoriel un framework javascript

je me dis donc que cette fonction peut etre créé en javascript sans passer par le jquery

non??