Tengo texto coincidente en diferentes partes de un documento. El primero es un conjunto de "etiquetas" en una tabla como esta:
<div id="my-div"> <div><a href="#">tag 1</a></div> <div><a href="#">tag 2</a></div> </div>Luego, en varias otras partes del documento, tengo un elemento oculto después de los elementos que quiero resaltar cuando se selecciona el enlace correspondiente de la siguiente manera:
<div class="hide-me">tag 1</div>Entonces mi función de clic es así:
$('#my-div a').click(function() { var txt = $(this).text(); console.log(txt); });El resultado es una cadena vacía, pero no estoy seguro de por qué.
tu código parece ser correcto, prueba este también.
$('#my-div a').click(function(e) { var txt = $(e.target).text(); console.log(txt); });En su caso, no usaría el texto del enlace, ya que es posible que cambie en el futuro (es decir, necesita traducir su sitio web). La mejor solución es agregar un atributo personalizado a los enlaces:
<div id="my-div"> <div><a href="#" sectionId="someId1">tag 1</a></div> <div><a href="#" sectionId="someId2">tag 2</a></div> </div>Y luego coloque la identificación de la etiqueta oculta allí, para que pueda:
$('#my-div a').click(function() { var sectionId = $(this).attr('sectionId'); $('#' + sectionId).show(); return false; // return false so the browser will not scroll your page });$('#my-div a') es ambiguo.
Va a leer todas las etiquetas a dentro de '#my-div'
Debe especificar en cuál de las 2 etiquetas se hace clic.