HTML代码:

<ul id="menu-controls">
<li><a target="_self" onclick="return displaySubMenu(0);" id="menu-controls-0" href="" class=""><span>Home</span></a></li>
<li><a target="_self" onclick="return displaySubMenu(1);" id="menu-controls-1" href="" class=""><span>Oleg Test</span></a></li>
<li><a target="_self" onclick="return displaySubMenu(2);" id="menu-controls-2" href="" class="act"><span>Products</span></a></li>
<li><a class="active" onclick="return displaySubMenu(3);"target="_self" ><span>About Us</span></a> </li>
<li><a class="" onclick="return displaySubMenu(4);"><span>Contact Us</span></a></li>
<li><a class="" onclick="return displaySubMenu(5);" class=""><span>Login / Register</span></a></li>
</ul>


在点击链接上调用displaySubMenu时,如何确定“上一个活动类是左还是右”?

是否需要在显示菜单功能中检查“活动”类别是左侧还是右侧?

最佳答案

您可以使用.index()来确定a.active的位置:

$("#menu-controls li a").click(function () {

    var myActive = $("a.active").parent().index();
    var myClicked = $(this).parent().index()

    if (myActive < myClicked) {
        alert("Previous active was left")
    } else if (myActive > myClicked) {
        alert("Previous active was right")
    } else if (myActive == myClicked) {
        alert("Previous active is this clicked one")
    }

    $("a.active").removeClass("active");
    $(this).addClass("active")

})


检查Fiddle

10-06 15:10