zoukankan      html  css  js  c++  java
  • 根据顶部页面链接 打开左侧按钮样式

    这个需求是用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>

  • 相关阅读:
    jquery操作cookie
    javascript数组(五)
    javascript var变量删除
    javascript 语句和严格模式(三)
    javascript 表达式和运算符 (二)
    javascript类型判断
    javascript 六种数据类型(一)
    计算机网络之网络排查(四)
    计算机网络封装解封装(三)
    计算机网络—从输入网址到显示网页的过程(二)
  • 原文地址:https://www.cnblogs.com/jscoffe/p/4065267.html
Copyright © 2011-2022 走看看