织梦带二级栏目的导航菜单高亮显示，下面代码未精简。客户就让我在模板里干，所以简单粗暴。
导航截图：
织梦模板代码如下：
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
<style>.mrdede_all{display:none}@media (max-width: 768px) {.mrdede_all{display:block;}}</style> {dede:channelartlist typeid='top' currentstyle='active'} {dede:field name='typeurl' runphp='yes'}global $GLOBAL;$GLOBAL['typeurl']=@me;@me='';{/dede:field} <li class="dropdown margin-left-20"> <a href="{dede:field name='typeurl'/}" title="{dede:field name='typename'/}" {dede:field name='typeid' runphp='yes'} global $dsql,$tid; if(@me==$tid){ $type = " class='dropdown-toggle link active'"; }else{ $row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE (`id`=$tid AND `reid`=@me) OR (`id`=@me AND `reid`=$tid)"); $type=is_array($row)?" class='dropdown-toggle link active'":" class='dropdown-toggle link'"; } $row = $dsql->GetOne("SELECT id,reid FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); $type2=is_array($row)?'data-toggle="dropdown" data-hover="dropdown" aria-expanded="false" role="button"':''; @me = $type . ' ' . $type2; {/dede:field}> {dede:field name='typename'/} {dede:field name=typeid runphp='yes'} global $dsql,$tid,$GLOBAL; $_str = @me==$tid?'active':''; $row = $dsql->GetOne("SELECT typename FROM `#@__arctype` WHERE id=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); $row2 = $dsql->GetOne("SELECT id,typename FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); @me=is_array($row2)?'<i class="fa fa-angle-down small"></i></a><ul class="dropdown-menu dropdown-menu-right bullet" role="menu"><li class="mrdede_all"><a href="'.$GLOBAL['typeurl'].'" class="'.$_str.'">'.$row['typename'].'</a></li>':'</a>'; {/dede:field} {dede:channel} <li><a href="[field:typelink/]" title="[field:typename/]" class="[field:id runphp='yes']global $tid;@me=@me==$tid?'active':'';[/field:id]">[field:typename/]</a></li> {/dede:channel} {dede:field name=typeid runphp='yes'} global $dsql; $row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); @me=is_array($row)?'</ul>':''; {/dede:field} </li> {/dede:channelartlist} |
上面的代码，在内容页时不显示高亮，所以修改后，如下：
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<li><a href="/" title="网站首页" {dede:field name=typeid runphp="yes" }(@me=="")? @me=" class='link active'" :@me="" ;{/dede:field}>网站首页</a></li> <style>.mrdede_all{display:none}@media (max-width: 768px) {.mrdede_all{display:block;}}</style> {dede:channelartlist typeid='top' currentstyle='active'} {dede:field name='typeurl' runphp='yes'}global $GLOBAL;$GLOBAL['typeurl']=@me;@me='';{/dede:field} <li class="dropdown margin-left-20"> <a href="{dede:field name='typeurl'/}" title="{dede:field name='typename'/}" {dede:field name='typeid' runphp='yes'} global $dsql,$tid,$arc; $tid=empty($tid)?$arc->Fields['typeid']:$tid; if(@me==$tid){ $type = " class='dropdown-toggle link active'"; }else{ $row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE (`id`=$tid AND `reid`=@me) OR (`id`=@me AND `reid`=$tid)"); $type=is_array($row)?" class='dropdown-toggle link active'":" class='dropdown-toggle link'"; } $row = $dsql->GetOne("SELECT id,reid FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); $type2=is_array($row)?'data-toggle="dropdown" data-hover="dropdown" aria-expanded="false" role="button"':''; @me = $type . ' ' . $type2; {/dede:field}> {dede:field name='typename'/} {dede:field name=typeid runphp='yes'} global $dsql,$tid,$GLOBAL; $_str = @me==$tid?'active':''; $row = $dsql->GetOne("SELECT typename FROM `#@__arctype` WHERE id=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); $row2 = $dsql->GetOne("SELECT id,typename FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); @me=is_array($row2)?'<i class="fa fa-angle-down small"></i></a><ul class="dropdown-menu dropdown-menu-right bullet" role="menu"><li class="mrdede_all"><a href="'.$GLOBAL['typeurl'].'" class="'.$_str.'">'.$row['typename'].'</a></li>':'</a>'; {/dede:field} {dede:channel} <li><a href="[field:typelink/]" title="[field:typename/]" class="[field:id runphp='yes']global $tid,$arc;$tid=empty($tid)?$arc->Fields['typeid']:$tid;@me=@me==$tid?'active':'';[/field:id]">[field:typename/]</a></li> {/dede:channel} {dede:field name=typeid runphp='yes'} global $dsql; $row = $dsql->GetOne("SELECT id FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); @me=is_array($row)?'</ul>':''; {/dede:field} </li> {/dede:channelartlist} |
上面的还是不够完美，因为客户发现文章页没有高亮显示，下面把文章模板页单独使用头模板head2.htm，使用前端JS来配合高亮显示，源码如下：
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
<ul class="nav navbar-nav navbar-right navlist"> <li> <a href="/" title="网站首页">网站首页</a></li> <style>.mrdede_all{display:none}@media (max-width: 768px) {.mrdede_all{display:block;}}</style> {dede:channelartlist typeid='top'} {dede:field name='typeurl' runphp='yes'}global $GLOBAL;$GLOBAL['_typeurl']=@me;@me='';{/dede:field} <li class="dropdown margin-left-0"> <a id="top_menu_{dede:field.id/}" href="{dede:field name='typeurl'/}" title="{dede:field name='typename'/}" class="dropdown-toggle link" {dede:field name='typeid' runphp='yes'} global $dsql,$GLOBAL; $row = $dsql->GetOne("SELECT id,reid FROM `#@__arctype` WHERE reid=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); $_str = (is_array($row)?' data-toggle="dropdown" data-hover="dropdown" aria-expanded="false" role="button"':'') . '>'; $row = $dsql->GetOne("SELECT typename FROM `#@__arctype` WHERE id=@me AND ishidden<>1 ORDER BY sortrank ASC LIMIT 0, 100"); $_str .= $row['typename']; $sons = GetSonIds(@me,0,false); $_str .= !empty($sons)?' <i class="fa fa-angle-down small"></i></a><ul class="dropdown-menu dropdown-menu-right bullet" role="menu"><li class="mrdede_all"><a href="'.$GLOBAL['_typeurl'].'">'.$row['typename'].'</a></li>':'</a>'; @me = $_str; {/dede:field} {dede:channel type='son'} <li><a class="son_menu" code="[field:id/]" top-code="[field:id runphp=yes]@me=(GetTopid(@me));[/field:id]" href="[field:typelink/]" title="[field:typename/]">[field:typename/]</a></li> {/dede:channel} {dede:field name='typeid' runphp='yes'} $row = GetSonIds(@me,0,false); $tof=!empty($row)?'</ul>':''; @me = $tof; {/dede:field} </li> {/dede:channelartlist} </ul> <input type="hidden" id="tid" value="{dede:field.typeid/}"> <script type="text/javascript"> function addClass(obj, cls){ var obj_class = obj.className, blank = (obj_class !== '') ? ' ' : ''; added = obj_class + blank + cls; obj.className = added; } var tid = document.getElementById('tid').value, son_menu = document.getElementsByClassName('son_menu'); for (var i = 0; i < son_menu.length; i++) { var code = son_menu[i].getAttribute('code'); if(tid === code){ addClass(son_menu[i], 'active'); // 当前文章的栏目高亮 var tops_code = son_menu[i].getAttribute('top-code'); addClass(document.getElementById('top_menu_' + tops_code), 'active'); } } </script> |
如果要改织梦PHP脚本来实现菜单高亮显示的，传送门 >> dede:channelartlist嵌套channel高亮显示当前栏目与顶级栏目的修改方法