jquery 控制模板菜单样式

问题:网站中模板的超链接菜单点击到不同的页面后,添加选中的样式,同类元素删除选中样式

解决:

HTML:如

<li><span><i class="icon1"></i><a href="/Home/Announcement">通知公告</a> </span></li>
<li><span><i class="icon1"></i><a href="/Home/ClassActivity">班级活动</a> </span></li>
<li><span><i class="icon1"></i><a href="/Home/HallOfFame">光荣榜</a></span></li>
<li><span><i class="icon1"></i><a href="/Home/DisciplinesFeedback">学科反馈</a></span></li>
<li><span><i class="icon1"></i><a href="/Home/Memorandum">备忘录</a></span></li>
<li><span><i class="icon1"></i><a href="/Teacher/Announcement">通知公告</a> </span></li>
<li><span><i class="icon1"></i><a href="/Teacher/ClassActivity">班级活动</a> </span></li>
<li><span><i class="icon1"></i><a href="/Teacher/HallOfFame">光荣榜</a></span></li>

<li><span><i class="icon1"></i><a href="/Teacher/DisciplinesFeedback">学科反馈</a></span></li>
<li><span><i class="icon1"></i><a href="/Teacher/Memorandum">备忘录</a></span></li>

这是链接到不通的页面,每个页面选中后添加选中样式 "on"

Jquery:

$(function () {
    var menus = $("#lnav").children().find("a");
    var hturl = window.location.href;
    $.each(menus, function (index, item) {
        var url = $(item).attr("href");
        var len = url.indexOf("/"); //控制器名称
        var lastlen = url.lastIndexOf("/"); //方法名称
        if (len >= 0) {
            var t = url.substr(len, lastlen - 1); //获取的控制器名称
            var action = url.substr(len);   //a标签的跳转链接
            var hlen = hturl.indexOf(t);    //浏览器地址是不是有控制器名称
            if (hlen >= 0) {
                var haction = hturl.substr(hlen);//浏览器地址的跳转链接
                if (action == haction) {
                    $(item).parents("li").addClass("on").siblings().removeClass("on");
                }
            }
        }
    });
});