jQuery：如何按类型获取最近的第一个“父级元素”？

Question

我需要在点击 a 元素时获取最近的第一个 li 父元素的 id。

<ul>
    <li id="wrong1">
        <ul>
          <li id="p1">
            <a href="" class='btn'></a>
          </li>
          <li id="p2">
            <a href="" class='btn'>Click here!</a>
          </li>
          <li id="p3">
            <a href="" class='btn'></a>
          </li>
        </ul>
    </li>
    <li id="wrong2"></li>
</ul>

当我点击“Click here!”时，应该会得到“li#p2”元素。

我的做法是：

$('a.btn').click(function(e) {
    var GotIt = $(this).parents().find('li').attr('id');
});

但显然它没有起作用。我也尝试了closest()，结果也一样。

请问如何正确获取元素？

- 夏期劇場

---

你尝试过 closest("li") 吗？ - freedomn-m

可能是 jQuery parent(), parents() 和 closest() 函数之间的区别 的重复问题。 - freedomn-m

Answer 1

你应该按照以下方式编写你的脚本

$('a.btn').click(function(e) {
    var GotIt = $(this).closest('li').attr('id');
});

因为"li"是您的"a"元素的直接父元素，所以您也可以这样使用。

$('a.btn').click(function(e) {
    var GotIt = $(this).parent().attr('id');
});

- RAUSHAN KUMAR

Answer 2

注意！

尽管给出的答案在这种情况下（你的情况）起作用，但它们是错误的 - 关于问题：

“具有[无论什么]的最近父级”

正确的答案是

$element.parent().closest([what ever])

closest() 包括元素本身，只要它不是 [whatever]，脚本就能正常工作，但是...

这是许多脚本中潜伏的错误，在开发过程中稍后进行 DOM 设计更改时会出现。

文档说明 closest():

对于集合中的每个元素，通过测试元素本身并向上遍历其祖先节点来获取第一个与选择器匹配的元素。

(粗体为本人加粗)

- halfbit

Answer 3

try this closest() JQuery Method

- Mahendra Kulkarni

Answer 4

您可以使用closest(type)，例如：

$('a.btn').click(function(e) {
    var li = $(this).closest("li");
    alert(li.attr("id"))
});

Fiddle: https://jsfiddle.net/f14vjLmc/

- freedomn-m