Question

我有一个无序列表嵌套在一个无序列表中，如下所示：

<ul id="menu">
    <li><a href="#">Event Overview</a>
        <ul class="sub-menu">
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
        </ul>
    </li>
    <li><a href="#">About</a>
        <ul class="sub-menu">
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
        </ul>
    </li>

    <li><a href="#">Blog</a>
        <ul class="sub-menu">
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
        </ul>
    </li>

    <li><a href="#">Contact</a>
        <ul class="sub-menu">
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
            <li><a href="#">Some Text Here</a></li>
        </ul>
    </li>

</ul>

我需要选择<a>

中的最后一个<ul class="sub-menu">

我认为选择器将是$(".sub-menu a:last")，但这只选择绝对的最后一个。我需要它用一个子菜单类选择每个无序列表中的最后一个。

谢谢！

Answer 1

使用此：

$('.sub-menu li:last-child a')

选择a
包含在最后一个li子女中每个.sub-menu元素。

您不想选择a:last-child，因为每个a都是其li元素的最后一个孩子。

除非iterate through it as John Hartsock says，否则您也不想选择a:last或li:last，因为:last会选择整个jQuery DOM元素集中的最后一个元素

Answer 2

$("ul.submenu").each(function () {
   $("a:last", this)  // this will select the last a in each submenu
});

Answer 3

$(function() {
    $('.sub-menu').each(function() {
        $('li:last a', this) // do stuff
    });
});

添加了一个如何工作的小提琴：http://jsfiddle.net/mzyx3/

选择最后一个<a> in a series of classes</a>

3 个答案: