本帖最后由 phper002 于 2011-02-20 13:14:20 编辑

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
     <head>
      <title> New Document </title>
      <meta name="Generator" content="EditPlus">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
        <style>
            ul,li{padding:0;margin:0;list-style:none}
            #menu li{width:100px;background:#EEE;margin-right:1px;display:block;float:left;height:24px;line-height:24px;vertical-align:middle;text-align:center}
            #menu li:first-child{background:#CCC;}
        </style>
      <script>
          function MenuClick(obj){
            var tag = document.getElementsByTagName("li")
            for (var i=0;i<tag.length;i++ )
            {
                tag[i].style.background="#EEE"
                obj.style.background = "#ccc"        }
          }
      </script>
     </head> <body>
      <ul id="menu">
        <li onclick="MenuClick(this)">首页</li>
        <li onclick="MenuClick(this)">页面1</li>
        <li onclick="MenuClick(this)">页面2</li>
        <li onclick="MenuClick(this)">页面3</li>
      <ul>
     </body>
    </html>
      

  2.   

    感谢楼上的代码。但只是实现了点击哪个菜单栏,哪个变色的效果。还有两个效果没有实现。一是点击菜单栏后,不仅变色,同时在左栏显示与之对应的二级菜单。
    二是再点击左栏的二级菜单后,右边主内容区显示不同的php文件。