为父级的父级添加类答案

【问题标题】：Add class for parent of parent为父级的父级添加类
【发布时间】：2013-07-04 16:26:32
【问题描述】：

当单击父级的父级的子级时，如何在单击时在下拉菜单中添加一个类。这是我的html：

<ul id="FirstLevel">
    <li><a href="#">FirstLevel</a></li>
    <li><a href="#">FirstLevel</a>
        <ul class="secondLevel">
            <li><a href="#">SecondLevel</a></li>
                   <ul class="LastLevel">
                         <li><a href="#">LastLevel</a></li>
                         <li><a href="#">LastLevel</a></li>
                   </ul>
            <li><a href="#">SecondLevel</a></li>
            <li><a href="#">SecondLevel</a></li>

        </ul>
    </li>
    <li><a href="#">FirstLevel</a></li>
    <li><a href="#">FirstLevel</a></li>
    <li><a href="#">FirstLevel</a></li>
</ul

所以我需要的是那个； onclick on LastLevel 或 SecondLevel 我的菜单我想通过 jQuery 在 FirstLevel li 添加一个类，并在选择另一个子菜单时删除该类。

我已经尝试过了，但并没有真正奏效：

$('#firstUl').find('li').click(function(){ //removing the previous selected menu state $('#firstUl').find('li').removeClass('active'); //is this element from the second level menu? if($(this).closest('ul').hasClass('lastLevel')){ $(this).parents('li').parents('li').addClass('menuActive'); //this is a parent element }else{ $(this).addClass('menuActive'); } });

谢谢。

【问题讨论】：

请向我们展示您的 javascript 代码
只需在您的问题中更新它。不在评论中
那么究竟哪个 li 应该有这个类？
@Parthik Gosar first li

标签： javascript jquery html css drop-down-menu

【解决方案1】：

给您的 FirstLevel <li>'s 一个类，这样可以更轻松地定位正确的元素：

<li class="first-level"><a href="#">FirstLevel</a></li>

然后将点击处理程序附加到所有子<li>'s：

$('li.first-level li').on('click', function(e) {
  e.preventDefault(); // prevent the link from being followed
  $(this).closest('li.first-level').toggleClass('yourClass') // 
         .siblings('li.first-level').removeClass('yourClass');
});

Here's a fiddle

【讨论】：

很有趣，但这给了我一个适合所有 ul, li 来自菜单的课程：|我只为一级 li 准备了该课程。
它只会将类添加到第一级<li>，您看到样式被“应用”到子级的原因是因为它们都包含在第一级<li>跨度>
您可以将类添加到锚点，see here

【解决方案2】：

这可以满足您的所有需求：

$("ul.secondLevel a").click(function () {
    $("#FirstLevel>li").removeClass("blue");
    $(this).parents("ul.secondLevel").parent().addClass("blue");
});

在这里查看：http://jsfiddle.net/c4dTK/

【讨论】：

【解决方案3】：

解决办法如下：

$('.secondLevel li a').click(function (e) {
    $('#FirstLevel > li').removeClass('selected');
    $(this).parents('.secondLevel').parent().addClass('selected');
})

【讨论】：

感谢您复制我的回复
@BalintBako 抱歉，我之前没有看到您的回复，我们都给出了相同的回复只是一个巧合。但如果你仍然觉得我抄袭了，我可以删除我的回复。 :)
我真的不介意 :) 如果不是复制粘贴

【解决方案4】：

由于您的第一级列表已获得一个 ID，您可以使用如下选择器查找元素：

$(".secondLevel a").click(function () {
    e.preventDefault();
    $("#FirstLevel li").addClass("newClass");
});

【讨论】：

【解决方案5】：

试试这个

jQuery(this).parent('ul').addClass('yourClass');

或者：

jQuery(this).parents('ul').addClass('yourClass');

【讨论】：

【解决方案6】：

这里有另一个答案

var test= $('li li,li li li')
console.log(test)
            test.click(function(){
   $(this).parents('ul').closest('li').addClass('kaka');
});

jsfiddle

【讨论】：

这个添加一个类到所有第二个ul LI只需要为第一级li添加一个类
那么，似乎有什么问题？它首先选择li，或者不是？