/ / Obtener texto del elemento de etiqueta al hacer clic en el enlace: javascript, jquery, html

Obtenga texto del elemento de etiqueta al hacer clic en el enlace: javascript, jquery, html

Tengo una lista desordenada y debajo de cada <li> elemento tengo un <label> y un enlace para obtener el texto de <label>.

Por ejemplo, si hago clic en el primer enlace "Copiar texto", quiero obtener "label1" y para el segundo quiero "label2".

He ideado el siguiente código, pero no funciona. ¿Alguien puede por favor ayudarme a arreglar esto?

Código HTML :

<ul>
<li>
<label>label1</label>
<a onclick="copyText()">Copy Text</a>
</li>
<li>
<label>label2</label>
<a onclick="copyText()">Copy Text</a>
</li>
</ul>

Código JS:

function copyText() {
alert($(this).closest("li").children("label").text());
}

Respuestas

2 para la respuesta № 1

Necesitas pasar el contexto del elemento, y cambiar. Text a .text().

onclick="copyText(this)"
function copyText(el) {
alert($(el).closest("li").children("label").text());
}

Ejemplo aquí


Puedes simplemente evitar jQuery y obtener el texto del elemento directamente:

function copyText(el) {
alert(el.previousSibling.textContent);
}

Sugiero usar un JavaScript discreto y agregar escuchas de eventos en su lugar:

$("li a").on("click", function () {
alert($(this).closest("li").find("label").text());
});

Ejemplo aquí