Tengo un menú contextual en el que quiero usar cierto método que encuentra p / div , así que ahora solo estoy iniciando sesión para ver si encuentro el elemento adecuado cuando hago clic.
HTML
<div>Hello I'm div</div> <p>I'm para <span>I'm span inside para</span></p>código
var paraElm = $target.closest("p") if(paraElm){ console.log("i have selected the element is para",paraElm) }me da una matriz en la salida
log para para
i have selected the element is para, n.fn.init [p.locked.sender, prevObject: n.fn.init(1),context: p.locked.sender] 0: p.locked.sender context: p.locked.sender length: 1 log para span dentro de para
i have selected the element is para, n.fn.init [p.locked.sender, prevObject: n.fn.init(1), context: span.selected] 0: p.locked.sender context: span.selected length: 1 cuando hice clic en span , no debería registrarse incluso si está dentro de la etiqueta p
ACTUALIZACIÓN n. ° 1: hice algunos cambios, usé una condición para eliminar no se registrará para la etiqueta de span , solo en JSFiddle no funciona según lo previsto, pero funciona como esperaba.
$(document).ready(function() { $("body").on('click', function(event) { var $target = $(event.target); var getElm = $target.closest('p'); if (getElm.context.nodeName.toLowerCase() != 'span') { console.log("I got the element", getElm); } }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div>Hello I'm div</div> <p>I'm para <span>I'm span inside para</span></p> // i hope this solve your issue $(document).ready(function() { $('span').addClass('span'); $('body').on('click', function(event) { editTask(event.target); }); }); function editTask(node) { if(!($(node).hasClass('span'))){ var closest_element = $(node).text(); console.log(closest_element); } } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div>Hello I'm div</div> <p>I'm para <span>I'm span inside para</span></p>Hice algunos cambios, usé una condición para eliminar no registrará la etiqueta de intervalo, pero funciona como esperaba.
$(document).ready(function() { $("body").on('click', function(event) { var $target = $(event.target); var getElm = $target.closest('p,div'); if (getElm && getElm.length) { console.log("I got the element", getElm[0]); } }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div>Hello I'm div</div> <p>I'm para <span>I'm span inside para</span></p> <p>I'm para 2</p>