切换城市有关问题

切换城市问题!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xh

切换城市问题


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>code.js.cn</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body,html{margin:0;padding:0;font-size:12px;font: 12px/1.5 arial;background:#A2DDEF;}
#head{background:#454545;height:110px;}
.shell{margin:20px 0 0 50px;}
.shell strong{background:#606060;color:#eee;font-size:16px;padding: 5px 20px;margin-left:60px;}
.shell span{color:#fff;font-size:12px;margin-left:10px;cursor:pointer;}
#logo img{border:none;}
#menu{position:absolute;background:#515151;color:#eee;padding:4px;}
#menu ul,#menu li{margin:0;padding:0;list-style:none;}
#menu li a{display:block;font-size:14px;color:#fff;text-decoration:none;zoom:1}
#menu li a:hover,#menu li.focus a{background:#606060;}
#menu li{float:left;display:inline;width:78px;line-height :25px;text-align:center;margin-left:4px;}
#menu ul{border-bottom:1px dashed #666;float:left;padding:5px;width:340px;}
.menufoot{clear:both;text-align:right;padding:10px;}
.menufoot a{color:#339999;text-decoration:none;padding:5px 10px;}
.menufoot a:hover{background:#606060;color:#339999;text-decoration:none;}
.nav{background:#44ABAF;height:70px;border-top:4px solid #338888;}
</style>
</head>
<body>
<div id="head">
    <div class="shell"><a href="###" id="logo"><img src="http://www.meituan.com/static//css/i/logo.gif" alt="切换城市有关问题" /></a>
    <strong>深圳</strong><span id="menuBtn">切换城市</span></div>
</div>
<div class="nav"></div>
<div id="menu" style="display:none;">
    <ul>
        <li><a href="" >北京</a></li>
        <li><a href="" >上海</a></li>
        <li><a href="" >武汉</a></li>
        <li><a href="" >广州</a></li>
        <li class="focus"><a href="" >深圳</a></li>
        <li><a href="" >杭州</a></li>
        <li><a href="" >南京</a></li>


        <li><a href="" >成都</a></li>
        <li><a href="" >天津</a></li>
        <li><a href="" >西安</a></li>
        <li><a href="" >福州</a></li>
        <li><a href="" >重庆</a></li>
        <li><a href="" >厦门</a></li>
        <li><a href="" >青岛</a></li>
        <li><a href="" >大连</a></li>
    </ul>
    <div class="menufoot"><a href="" >其它城市?</a></div>
</div>
</body>
<script type="text/javascript">
//<![CDATA[
ldh={
    get:function (el){
        return typeof el=="string"?document.getElementById(el):el;
    },
    on:function(el,type,fn){
        el=this.get(el);
        el.attachEvent?
        el.attachEvent('on'+type,function(){fn.call(el,event)}):
        el.addEventListener(type,fn,false);
        return this
    },
    align:function (el,el2,x,y){
       var rect=this.get(el2).getBoundingClientRect(),x=x||0,y=y||0;
        el.style.top=rect.top+this.get(el2).offsetHeight+y+'px';
        el.style.left=rect.left+x+'px'
    },
   stop:function (e){
        e=e||window.event;
        e.stopPropagation&&e.stopPropagation();
        e.cancelBubble=true
    },
    onblur:function(el,fn) {
        el=this.get(el);
        this.on(el,'click',function (e){
            ldh.stop(e)
        }).on(document, 'click',function(e) {


            el.style.display='none';
        });
        return this
    }
};
ldh.onblur('menu').on('menuBtn','click',function (e){
    var css=ldh.get('menu').style;
    if(css.display!='none')return ;
    ldh.align(ldh.get('menu'),this,-85,10);
    css.display= 'block';
    ldh.stop(e);
})
 //]]>
</script>
</html>



本人JS菜鸟,上面是在网上找到的JS,但不知道怎样选择城市的时候,在切换城市边上的城市名称跟着也变。我选择哪一个城市,切换城市边上的城市名称也跟着变。。
[解决办法]
改写了下  不知道是不是你要的 


忘记这个A也要加个#   <li class="focus"><a href="#" >深圳</a></li>

不然会刷新页面的