jquery添加删除类onclick

Posted 2023-04-13

【中文标题】jquery添加删除类onclick

【英文标题】：jquery add remove class onclick

【发布时间】：2011-10-31 13:38:35

【问题描述】：

我有任何导航菜单！

   <div class="nav">
    <ul class="navigation">
    <li class="selected"><a href="#">HOME</a></li>
    <li><a href="#">PROFILE></a></li>
    <li><a href="#">CONTACTUS</a></li>
    <li><a href="#">ABOATUS</a></li>
    </ul>
    </div>

现在如何在点击任何（个人资料、Contactus、aboutus）后添加选定的类并使用 Jquery 删除选定的主页。

谢谢

【参考方案1】：

假设您只想拥有类名selected 的一个元素，我建议：

$('ul.navigation li a').click(
    function(e) 
        e.preventDefault(); // prevent the default action
        e.stopPropagation(); // stop the click from bubbling
        $(this).closest('ul').find('.selected').removeClass('selected');
        $(this).parent().addClass('selected');
    );

JS Fiddle demo.

【讨论】：

抱歉，你能解释一下e.stopPropagation() 冒泡 dom 树是什么意思吗？是否可以将周围的包装器附加到点击事件？

【参考方案2】：

你可以使用toggleClass：

$("#myElement1").click(function()
   $("#myElement2").toggleClass("myClass");
);

【参考方案3】：

$("a").click(function()

  $("a").parent().removeClass("selected");

  $(this).parent().addClass("selected");
);

Live Demo

【讨论】：

谢谢我测试了这个，这适用于哪个 ID 、类或所有链接