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”）; //删除所有“活动”类

您要在上面的语句中添加类，您需要使用removeClass()方法而不是添加类

<强> Live Demo

$("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

无序列表项<li>在以编程方式提供时无法保留类</li>

2 个答案: