使用jQuery单击添加和删除类？

Question

我正在尝试添加和删除被单击的li元素上的类。这是一个菜单，当我单击每个li项目时，我希望它获得该课程，而所有其他li项目都将其删除。因此，一次只有一个li项目上课。这就是我所走的路（请看小提琴）。我不确定如何使“ about-link”从当前类开始，但是当单击其他li项之一时将其删除？$('#about-link').addClass('current');$('#menu li').on('click', function() {    $(this).addClass('current').siblings().removeClass('current');});

Answer 1

为什么不尝试这样的事情？

$('#menu li a').on('click', function(){

    $('#menu li a.current').removeClass('current');

    $(this).addClass('current');

});

Answer 2

您可以尝试一下，这可能有助于在大型函数上给出较短的代码。

$('#menu li a').on('click', function(){

    $('li a.current').toggleClass('current');

});

Answer 3

其他li元素不是a元素的兄弟姐妹。

$('#menu li a').on('click', function(){

    $(this).addClass('current').parent().siblings().children().removeClass('current');

}); 

Answer 4

您正在将类应用于<a>元素，它们不是兄弟姐妹，因为它们每个都包含在<li>元素中。您需要将树上移到父级，<li>并在该级别的同级中找到`元素。

$('#menu li a').on('click', function(){

$(this).addClass('current').parent().siblings().find('a').removeClass('current');

});