Question

我想在点击事件中将类名更改为活动...我想从第一个li标签中删除活动的类名，并在两个li标签的“Menu1”中附加活动的类名，反之亦然...如何用JQuery做这个东西

<ul>
<li class="active">menu</li>
<li class="">
    <ul class="submenu">
        <li class="">menu1</li>
    </ul>
</li>
<li class="">menu2</li>

这样的事情

<ul>
<li class="">menu</li>
<li class="active">
    <ul class="submenu">
        <li class="active">menu1</li>
    </ul>
</li>
<li class="">menu2</li>

Answer 1

$('li').click(function()
{
$(this).toggleClass('active');
return false;

});

请参阅此链接以获取更多信息

Toggle class或addclass

Answer 2

单击任何<li>元素，您可以从所有列表项中删除类active，然后将active类仅添加到当前单击的列表项以及最接近的{{} 1}}使用li：

的父级

.closest()

<强> Fiddle Demo

<小时/> 修改：忽略上述答案，您可以使用

$('ul li').click(function() {
    $('ul li').removeClass('active')
    $(this).addClass('active').closest('li').addClass('active')
});

将活动类添加到子菜单中的子.find()：

li

<强> Updated Fiddle

Answer 3

您可以这样使用：

$('li.active').toggleClass('active').next('li').toggleClass('active').find('li').toggleClass('active');

demo

Answer 4

所以首先要删除dom中的所有活动类，使用$("li").removeClass("active")然后将类激活到所选项，这样就可以了：

$("li").on("click", function(){
   $("li").removeClass("active");
   $(this).addClass("active");
});

如何在click事件上更改类名

4 个答案: