无序列表<Li>项 在以编程方式给定时无法保留类

Question

我的问题是我试图在单击其项目时更改li项目的类。我在这方面成功了，但问题是类被赋予了 li 项目，但它无法保留类。

我的 html 和 jquery 是这样的

    $(document).ready(function () {        
            //On Click Event
            $("ul.tabs li").click(function () {
            $("ul.tabs li").removeclass("active"); //Remove any "active" class
            $(this).addClass("active"); //Add "active" class to selected tab                     
        });
    });
</script>
<div class="menu_nav">
     <ul class="tabs">
        <li><a href="default.aspx"><span>Home Page</span></a></li>
        <li><a href="support.aspx"><span>Support</span></a></li>
        <li><a href="aboutus.aspx"><span>About Us</span></a></li>
        <li><a href="services.aspx"><span>Services</span></a></li>
        <li><a href="contactus.aspx"><span>Contact Us</span></a></li>
    </ul>
</div>

Answer 1

$（"ul.tabs li"）.addClass（"active"）;//删除任何"active"类

你在上面的语句中添加类，你需要使用 removeClass（） 方法而不是添加类

现场演示

$("ul.tabs li").removeClass("active"); //this will remove active class from all tabs
$(this).addClass("active"); //Add "active" class to selected tab

Answer 2

你的代码是正确的，但这里有一个错字：

$("ul.tabs li").removeclass("active");
             //   ----^----------------make "c" in caps "C"

并确保阻止链接的默认行为，否则您将刷新页面。

$("ul.tabs li").click(function (e) {
   e.preventDefault();
   // then all your code stuff here