jquery - 最近的显示未定义

Question

我正在制作一个书签应用程序，我想针对特定目的定位并获取id最近的li内部任务。我ul尝试了这段代码，但它不起作用。希望你们帮帮我

<script src="js/jquery.js"></script>
<script>

$(document).ready(function(){

  $("#clicker").click(function(){
    var id = $("#tasks").closest("li").attr("id");
    alert(id);
  });

});

</script>

<h1><a id="clicker" href="#">Click Me</a></h1>

<ul id="tasks">
  <li id="4">Apples</li>
  <li id="3">Oranges</li>
</ul>

Answer 1

jQuery.fn.closest并非旨在针对最接近的元素匹配，而是最接近的祖先（请参阅文档：http ://api.jquery.com/closest/ ）。

你要做的是在那里选择一个孩子：

$("#clicker").click(function(){
    var id = $("#tasks").children("li").attr("id");
    alert(id);
});

Answer 2

您可能想尝试：

var id = $("#tasks > li:first").attr("id");

我们用了：

1. JQuery 的parent > child选择器选择列表li下的所有项目 #tasks。
2. 然后使用:first选择器li从所有列表中选择第一个。

Answer 3

closest选择元素最近的父元素，而不是最近的元素，可以使用findorchildren方法，如果要查找第一个li元素，可以使用:first选择器或first方法过滤结果；

$(document).ready(function(){
  $("#clicker").click(function(){
    var id = $("#tasks").find("li:first").attr("id");
    alert(id);
  });
});