如何获取点击元素的值

Question

我试图通过 jQuery 在每次单击锚标记“show”时获取 li 元素的文本（1、2、3...），但似乎无法使其工作。

这就是我正在处理的：

HTML：

<ul>

<li class="item_id">1</li>

<a class="show" href="#">SHOW</a>

</ul>

<ul>

<li class="item_id">2</li>

<a class="show" href="#">SHOW</a>

</ul>

<ul>

<li class="item_id">3</li>

<a class="show" href="#">SHOW</a>

</ul>

JavaScript：

/**This shows all values on each click and not only the current one**/

$("a.show").click(function(){

  $('li.item_id').each(function() {

      var item_id = $(this).text();

          alert(testimonial_id);                    

        });

});

/**This shows the first value on each click and not only the current one**/

$("a.show").click(function(){

    var item_id = $("li.item_id").text();

    alert(item_id);

});

提前致谢！

Answer 1

你可以使用$(this).closest('ul').find('li.item_id')onclick 使用函数定位父元素closest。然后find.finallyli.item_id返回文本$("a.show").click(function() {  let item_id = $(this).closest('ul').find('li.item_id').text();  console.log(item_id)});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><ul>  <li class="item_id">1</li>  <a class="show" href="#">SHOW</a></ul><ul>  <li class="item_id">2</li>  <a class="show" href="#">SHOW</a></ul><ul>  <li class="item_id">3</li>  <a class="show" href="#">SHOW</a></ul>Javascript: