首页 > 其他分享 >JQuery一行搞定当前面所对应的导航菜单变亮效果

JQuery一行搞定当前面所对应的导航菜单变亮效果

时间:2022-12-12 23:05:03浏览次数:36  
标签:JQuery 搞定 hover 变亮 代码 li 菜单 母板 find

前提:所有页面用的是一个母板页,并且导航菜单放在母板页

HTML代码如下:

 <div class="mainnav">
<ul class="banner">
<li class="index"><a href=HTTP://A.COM/HOME>首页</a></li>
<li class="index"><a href=HTTP://A.COM/NEWS>考试资讯</a></li>

<li class="index hover"><a href=HTTP://A.COM/CLASS>辅导课程</a></li>
<li class="index"><a href=HTTP://A.COM/STAR>星级服务</a></li>

<li class="index"><a href="http://bbs.A.com/">学习论坛</a></li>

<li class="index"><a href=HTTP://A.COM/Teacher>名师团队</a></li>
</ul>
一小段C#代码,用来得到URL的HOST的部分
<% string aa = Request.Url.AbsolutePath; %>
而一行的JQUERY代码如下:
<script type="text/javascript">
$(function() {
$(".mainnav>.banner").find("li").find("a[href$='<%=aa%>']").closest("li")

.addClass("hover").siblings().removeClass("hover")

});
</script>

作者:仓储大叔,张占岭,
荣誉:微软MVP

标签:JQuery,搞定,hover,变亮,代码,li,菜单,母板,find
From: https://blog.51cto.com/u_15765017/5932124

相关文章