Как получить текстовое значение щелкнутой ссылки?

У меня есть соответствующий текст в разных частях документа. Первый - это набор "тегов" в таблице, например:

<div id="my-div">
  <div><a href="#">tag 1</a></div>
  <div><a href="#">tag 2</a></div>
</div>

Затем в нескольких других частях документа у меня есть скрытый элемент после элементов, которые я хочу выделить, когда соответствующая ссылка выбрана так:

<div class="hide-me">tag 1</div>

Тогда моя функция щелчка выглядит следующим образом:

$('#my-div a').click(function() {
  var txt = $(this).text();
  console.log(txt);
});

Вывод пустой строки, но Im не уверен, почему.

Ответ 1

ваш код кажется правильным, попробуйте тоже.

$('#my-div a').click(function(e) {
  var txt = $(e.target).text();
  console.log(txt);
});

Ответ 2

В вашем случае я бы не использовал текст ссылки, так как это возможно, это может измениться в будущем (т.е. вам нужно перевести свой сайт). Лучшее решение - добавить пользовательский атрибут к ссылкам:

<div id="my-div">
  <div><a href="#" sectionId="someId1">tag 1</a></div>
  <div><a href="#" sectionId="someId2">tag 2</a></div>
</div>

Затем добавьте идентификатор скрытого тега, чтобы вы и с помощью:

$('#my-div a').click(function() {
  var sectionId = $(this).attr('sectionId');
  $('#' + sectionId).show();
  return false; // return false so the browser will not scroll your page
});

Ответ 3

$('# my-div a') является неоднозначным.

Он читает все теги в '# my-div'

U нужно указать, какой из двух тегов щелкнуть.