标签:
这几天一直在整用户中心。
js动态写菜单栏,并根据路径名来selected改变颜色。
示意图
html代码
<div class="menu_warp">
<script src="<{$static_url}>callcenter/scripts/menu.js"></script>
</div>
JS代码
(function(){
var map = {
‘index‘ : 0,
‘self_help‘ : 1,
‘helps‘ : 2,
}
function isSelect(idx){
var pathname = location.pathname;
pathname = pathname.split(‘/‘)[2];
return map[pathname] != idx ? ‘ <li>‘ : ‘ <li class="selected">‘
}
document.write(‘<div class="menus">‘);
document.write(‘<ul class="menu_ul">‘);
document.write(isSelect(0));
document.write(‘ <a href="/callcenter/index" class="su_nav">首页</a>‘);
document.write(‘ </li>‘);
document.write(isSelect(1));
document.write(‘ <a href="/callcenter/self_help" class="su_nav">自助服务</a>‘);
document.write(‘ </li>‘);
document.write(isSelect(2));
document.write(‘ <a href="/callcenter/helps" class="su_nav">帮助</a>‘);
document.write(‘ </li>‘);
document.write(‘</ul>‘);
document.write(‘</div>‘);
document.write(‘<a href="javascript:;" class="su_logo">‘);
document.write(‘ <img style="width:300px;"src="http://gameapi.xiaoyou-game.com/static/usercenter/images/xiaoyoutianxia.png" />‘);
document.write(‘</a>‘);
})();
标签:
原文地址:http://www.cnblogs.com/feiwu123/p/5362977.html