Question

现在我有这样的导航：

<div>
    <div id="navbar">
        <a class="nav" id="Cars" >Cars</a>
        <a class="nav Active Home" >Home</a>
        <a class="nav" id="Brands" >Brands</a>  
    </div>
</div>

我使用click事件执行jquery代码，如下所示：

$(".Home").click(function() {
    cont.executeCarsPanorama();
    $("#Cars").removeClass("Active");
    $("#Brands").removeClass("Active");
    $(".Home").addClass("Active");
})

现在，如果我想使用<li>而不是<a>代码，我将如何执行jQuery代码？

我认为li无法触发点击事件？

Answer 1

$("li").click(function(){
    //your code
}

Answer 2

这将从任何li元素中删除所有活动类，但它会将Active类添加到您单击的类中。

$('li').click(function() {
    $('li').removeClass('Active');
    $(this).addClass('Active');
});

Answer 3

您可以这样做：

$('#navbar li').click(function() {
    $(this).siblings().removeClass('Active')
    $(this).addClass('Active');
    // Do other stuff
});

如果您要在<li>上放置点击事件（您可以），则应限制为#navbar，否则如果用户点击该页面和其他{{1}，您可能会遇到意想不到的效果}。

点击li元素上的事件

3 个答案: