• 技术文章 >后端开发 >php教程

    javascript - 模板继承中如何正确的高亮当前导航?(在线等...)

    2016-10-22 00:14:18原创474

    类似于上面这种导航,我在thinkphp中利用其模板继承的原理定义了一个base.html的文件,其中包含通用的header头部、nav导航、footer底部,其它的html文件会继承该base.html模板。

    在线等,希望各位朋友能指点下疑惑。

    回复内容:

    类似于上面这种导航,我在thinkphp中利用其模板继承的原理定义了一个base.html的文件,其中包含通用的header头部、nav导航、footer底部,其它的html文件会继承该base.html模板。

    在线等,希望各位朋友能指点下疑惑。

    这个貌似属于js控制的吧,而且楼主也做了nav导航了,thinkphp 当中用它的标签 ,引入试试不知道行不行,因为它默认要跑入口文件 就包含 还真的需要用它的

    加载页面后,判断下当前的url,是否是以header.html中的a标签的href开头,

    例如当前url:xxx.com/home/xxxx => a href="//m.sbmmt.com/m/article/xxx.com/home",匹配后添加class active高亮

    你应该是因为同一layout页面需要包含不同页面而不知如何为每个页面显示它所属的导航而困扰吧?

    如果是的话,那么js方面,你可以从url入手,分析url规则,然后高亮菜单

    PHP的话,url或者控制器方法都可以,也是判断,高亮的话,配合js或者css都可以实现

    总的来说,你需要记住的就是,根据访问的形式不同,剥离开来,进行判断,然后高亮,就可以了。

    方法1,可以用js控制,在每个包含这个base的页面中写js,特意没用ES6,方便你用。

    var nav = Array.prototype.slice.call(document.querySelectorAll('#nav a'));
    var currentPath = location.pathname;
    nav.forEach(function(a) {
        if(a.pathname === currentPath) a.classList.add('active');
    });

    方法2,用php。思路一样,获取当前请求的页面的url,然后匹配路径,不过php那一套都一年多不用了,忘记咋写了。。。。

    个人一般在_initialize中:

    $this->assign("cur_nav","home");
  • class="active" >装修公司
  • class="active" >装修招标
  • 类似于这种,然后模板中判断curr_nav的值。
    如果导航简单的话就直接通过模块、控制器、操作组合上判断
    js也能判断只是感觉页面会闪动不爽!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:javascript thinkphp php
    上一篇:php导出word文件,如何设置纸张格式? 下一篇:php怎样和c语言混合编程
    大前端线上培训班

    相关文章推荐

    • 推荐一本PHP程序猿都应该拜读的书_PHP• CodeIgniter自定义控制器MY_Controller用法分析_php实例• php实现给一张图片加上水印效果_php实例• Thinkphp关闭缓存的方法_php实例• ThinkPHP CURD方法之table方法详解_php实例

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网