onethink导航如何高亮当前导航菜单

浏览:5972 发布日期:2014/01/06 分类:技术分享 关键字: onethink

如在后台导航管理添加了导航菜单和url


这是前台导航菜单显示,我想高亮显示当前导航菜单,如点了新闻,新闻的li标签带上current样式,如何实现?            <div class="nav-collapse collapse">
                <ul class="nav">
                    <think:nav name="nav">
                        <eq name="nav.pid" value="0">
                        <li>
                            <a href="{$nav.url|get_nav_url}" target="<eq name='nav.target' value='1'>_blank<else/>_self</eq>">{$nav.title}</a>
                        </li>
                        </eq>
                    </think:nav>
                </ul>
            </div>
模板里面是调用think标签的nav方法,但是查看了该方法,也没这个选项,希望官方能够考虑一下这个需求,现在如何实现比较好呢

找到了,thinkphp官网导航高亮就是js实现的,源代码:<script type="text/javascript">
            (function(){
                //导航选中
                var url = location.pathname, navg = $('.main-nav li');
                if(url == '/' || url == '/index'){
                    navg.eq(0).addClass('current');
                }else if(!url.indexOf('/down')){
                    navg.eq(1).addClass('current');
                }else if(!url.indexOf('/extend')){
                    navg.eq(2).addClass('current');
                }else if(!url.indexOf('/app')){
                    navg.eq(3).addClass('current');
                }else if(!url.indexOf('/info')){
                    if(!url.indexOf('/info/document') || !url.indexOf('/info/add/cate_id/36') || !url.indexOf('/info/zhuanti')){
                        navg.eq(4).addClass('current');
                    }else{
                        navg.eq(7).addClass('current');
                    }
                }else if(!url.indexOf('/code')){
                    navg.eq(5).addClass('current');
                }else if(!url.indexOf('/case')){
                    navg.eq(6).addClass('current');
                }else if(!url.indexOf('/topic')){
                    navg.eq(8).addClass('current');
                }else if(!url.indexOf('/document')){
                    navg.eq(4).addClass('current');
                }
            })()
</script>
最佳答案
评论( 相关
后面还有条评论,点击查看>>