Question

<ul id="containerA" class="container">
        <li>
        <span class="sportsType" id="football">Football</span>
            <ul>
                <li class="sportsMatch">
                <img src="/static/img/arrow_left.png" class="subArrow"/>A vs B <img src="/static/img/arrow_left.png" class="star"/>
                </li>

当您点击带有星级星号的PNG时，我想返回最顶层的ul（containerA）。我可以使用.parent.parent.parent等，但它也需要使用另一组不太复杂的列表：

 <ul id="containerB" class="container">
 <li class="sportsMatch">
<img src="/static/img/arrow_left.png" class="subArrow"/>A vs B <img src="/static/img/arrow_left.png" class="star"/>
</li>

这是我的jscript，我可以用什么来获取最近的容器的id？

$(".star").click(function() {}

Answer 1

您将要使用.closest查找被点击元素（事件处理程序内部的this）的最近的anscestor。如果您想要容器的id，可以使用attr或prop，或者直接访问DOM元素并访问id属性（如@ sg3s指出的那样）他的评论）：

$(".star").click(function() {
    var $container = $(this).closest(".container"),
        containerId = $container.attr("id");
});

示例： http://jsfiddle.net/L7JyY/

Answer 2

使用closest method获取元素，然后使用attr方法获取ID：

var ul = $(this).closest('.container');
var id = ul.attr('id');

Answer 3

由于你要求的是最顶层的，因此在同性恋者的层次结构中可能会有多个具有class="container"的对象。如果是这种情况，那么你会这样做：

$(".star").click(function() {
    var topContainer = $(this).parents(".container").last();
}

如果你想要最近的祖先class="container"（例如不是最顶层的祖先，而是最接近点击对象的祖先），或者只有一个祖先{{1}那么你会做一些稍微简单的事情：

class="container"

Answer 4

如果UL总是有一个类'容器'，并且如果PNG之间没有其他元素具有相同的类，那么你可以这样做

$(".star").click(function() {
  $(this).closest('.container')
})

Answer 5

这将为您带来与选择器匹配的第一个升序父级：

$(".star").click(function() {
    $(this).parentsUntil(".container").parent();
}

http://api.jquery.com/parentsUntil/

JQUERY，找到最近的身份证？

5 个答案: