Question

Y无法访问我的UL列表中每个用于删除类名的列表

我的HTML：

<ul ListMaster>
  <li><a>Link A</a></li>
  <li><a>Link B</a></li>
  <li><a class="active">Link C</a></li>
  <li><a>Link D</a></li>
  <li><a>Link E</a></li>
</ul>

我的jQuery代码：

$(document).on("click","ul[ListMaster] li a", function() { // Good Job

        var list = $(this).closest("ul[ListaFondo] li"); // Im not sure

            $(list).each(function(){
                $(this+" a").removeClass("active"); // here the problem
            });

            $(this).addClass("active"); // Good

    return false;
});

简单的CSS：

ul{
  display: flex;
  flex-direction: column;
}
li{
  margin-bottom: 10px;
}
.active{
  background-color: SteelBLue;
  padding: 0.4em;
}

注意：因为我有几个UL列表，所以我需要从（必须添加标签，而不必将ID放入UL或类似标签）进行访问。

我的代码：

https://jsfiddle.net/r0b79uys/10/

对不起，我的英语不好。

Answer 1

问题是您必须首先在列表中删除一个活动类。

所以

$(document).on("click","ul[ListMaster] li a", function() { // Good Job

    //var list = $(this).closest("ul[ListaFondo] li"); // i commented out this

        $("li a").removeClass("active"); // removed  this 

        $(this).addClass("active"); // Good

    return false;
});

并更新了小提琴

https://jsfiddle.net/r0b79uys/10/

Answer 2

尝试类似

$(document).on("click","ul[ListMaster] li a", function() {
            $(this).closest('ul').find('.active').removeClass("active"); // go back to the ul using closest find all active anchor classes and remove the class from them 
            $(this).addClass("active");
    return false;
});

demo

jQuery如何删除ul的活动类名列出祖先最近的链接事件

2 个答案: