根据顶部页面链接 打开左侧按钮样式

这个需求是用CMS添加内容页,但内容页的全部菜单都在左侧显示,然后在当前页面与左侧的菜单相对应是同一个链接时,把左侧的菜单展开

是用jquery写的,原理很简单。先获取顶部页面的链接,然后循环左侧菜单的链接,取得最后的页面值,如果相等就添加样式来控制隐藏显示。

比如页面链接是: www.xx.com/article/11.html

下面是dom代码

<div id="menu">
<dl>
<dd> <a href="/article/1414677728161.html"><span>幫會BOSS</span></a> </dd>
<dd> <a href="#"><span>勢力榮譽</span></a> </dd>
</dl>
<dl>
<dt> <a href="#"> <i class="num-2">2</i> <strong>經濟系統</strong> </a> </dt>
<dd> <a href="#"><span>玩家交易</span></a> </dd>
</dl>

JS代码

<script>
$(function(){
var strUrl = window.location.href; //获取页面链接
var arrUrl = strUrl.split("/");        //用数组的形式以/分隔开
var strPage = arrUrl.slice(arrUrl.length-1, arrUrl.length).toString(String);  //取得最后两个值 11.html
$("#menu dl dd a").each(function(){
var leftUrl = $(this).attr("href");   //循环获得a的链接
var larrUrl = leftUrl.split("/");      
var lstrPage = larrUrl.slice(larrUrl.length-1, larrUrl.length).toString(String);  
if(lstrPage == strPage){
$(this).addClass("curr").parents("dl").addClass("activity");
}
});
});
</script>

原文地址:https://www.cnblogs.com/jscoffe/p/4065267.html