点击菜单,弹出或消失子菜单

来源:互联网 发布:淘宝上开店需要交钱吗 编辑:程序博客网 时间:2024/05/14 14:39

 <head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>

<body>
 <table >
  <tr>
   <td id="td1" onclick="doClick(this)">1</td>
   <td id="td2" onclick="doClick(this)">2</td>
  </tr>
 </table>
 <table id="t1" style="display:none">
  <tr>
   <td>
    1111111111111
   </td>
  </tr>
 </table>
 <table id="t2" style="display:none">
  <tr>
   <td>
    22222222222222
   </td>
  </tr>
 </table>
 <hr />
 <hr />
 <table>
  <tr>
   <td id="td3"  onclick="dothis(this)">3</td>
  </tr>
 </table>
 <table id="t3" style="display:none">
  <td>
   <tr>
    3333333333333
   </tr>
      <tr>
    4444444444444
   </tr>
      <tr>
                5555555555555
   </tr>
      <tr>
    6666666666666
   </tr>
  </td>
 </table>
</body>
</html>
<script type="text/javascript">
<!--
function doClick(o){
 
  var j;
  var id;
  var e;
  for(var i=1;i<=2;i++){
    id ="td"+i;
    j = document.getElementById(id);
    e = document.getElementById("t"+i);
    if(id != o.id){;
      e.style.display = "none";
    }else{
  e.style.display = "block";
    }
  }
}

function dothis(o){
 var i=document.getElementById("t3");
 if(i.style.display == "none"){
  i.style.display = "block";
 }else{
  i.style.display = "none";
 }
 
}
//-->
</script>