• dede使用方法---用js让当前导航高亮显示


          当前导航高亮显示能够提升用户体验,我也知道,大家在网上搜dede让当前导航高亮显示的方法一抓一大把,但是,并不一定适合自己的需求。就像我的需求一样,导航有个二级导航,然后需要做到让当前导航高亮显示。我最开始用的方法是dede自带的让当前导航高亮显示的方法,代码如下,其中主要实现的代码就是那一句currentstyle="<li 'menu_on'><a  href='~typelink~' >~typename~</a> </li>:

    <div id="menu">
     <ul>
      <li {dede:field name=typeid runphp="yes"}(@me=="")? @me=" class='menu_on'":@me="";{/dede:field}><a href="/">网站首页</a></li>
      {dede:channel type='top' row='8' currentstyle="<li 'menu_on'><a  href='~typelink~' >~typename~</a> </li>" }
      <li><a href="[field:typelink/]">[field:typename/]</a></li>
      {/dede:channel}
     </ul>
    </div>

          但是发现,我无法让它与二级导航很好的融入到一起,当然,这可能是我自个的原因,因为我个人对php并不太熟悉,所以可能dede的二次开发牵扯到php的时候会有点阻碍。没办法了,只能用自己手上的工具另外杀一条路出来。想到用js的方法实现,百度方法也是一大堆,经过很多次尝试之后,终于找到了有用的了。代码如下:

    <script type="text/javascript">  
          var myNav = document.getElementById("nav").getElementsByTagName("a");
          for(var i=0;i<myNav.length;i++){
            var links = myNav[i].getAttribute("href");
            var myURL = document.location.href;
            if(myURL.indexOf(links) != -1){
              myNav[i].className="active";
            }
          }
        </script>

          其中"active"就是你当前导航高亮显示的样式名。

          导航的代码截图如下所示:

  • 相关阅读:
    for 循环/ while 循环/ do-while 循环
    让元素脱离动画流
    缓存布局信息
    一个程序员的管理心得
    CenOS下Tomcat外网不能访问
    卸载CentOS自带的JDK并配置指定JDK环境变量
    Linux系统安装Mysql
    系统的非功能性需求
    做软件的追求
    路途小歇
  • 原文地址:https://www.cnblogs.com/sese/p/4973766.html
Copyright © 2020-2023  润新知