Question

<ul>
    <li class="solution device">
    <a href="#">Device</a>
        <ul>
            <li>
            <a href="#">Apple</a>
            <ul>
            <li><a href="#">iPad Air</a></li>
            <li><a href="#">iPad Mini</a></li>
            <li><a href="#">iPhone</a></li>
            </ul><!-- // end 3rd level -->
            </li>           
        </ul><!-- // end 2nd level -->
    </li><!-- // end 1st level -->
</ul>

如果用户点击任何链接，我想知道它在哪个级别。所以，如果你点击iPhone，它将是level = 3（如果从0开始索引则为2）。我可以硬编码，但我正在寻找一个动态的解决方案，可以使用任何级别的li，也不需要li或href上的类。任何聪明的想法？提前谢谢。

Answer 1

尝试（添加了一个ID top）到顶部ul元素

$('#top a').click(function(){
    var $lis = $(this).parentsUntil('#top', 'li');
    console.log($lis.length)
})

演示：Fiddle

Answer 2

您可以执行以下操作：

$('ul#root_id').on('click', 'li', function(){
   console.log($(this).parentsUntil('ul#root_id', 'li').length);
});

此处'ul#root_id'是您的根ul元素。阅读parentsUntil()。

获取嵌套列表中的链接级别？

2 个答案: