首页 > Web开发 > 详细

table+js实现网站左侧列表下拉隐藏

时间:2014-10-16 17:18:13      阅读:265      评论:0      收藏:0      [点我收藏+]

    <script language="javascript">
          
         function showHide(obj){
        
         try
         {
            if (obj.id=="M_1")
            {
            
              document.getElementById(‘M_2‘).style.display="none";
              document.getElementById(‘M_3‘).style.display="none";
              document.getElementById(‘M_4‘).style.display="none";
           
            }
           
            if (obj.id=="M_2")
            {
            
              document.getElementById(‘M_1‘).style.display="none";
              document.getElementById(‘M_3‘).style.display="none";
              document.getElementById(‘M_4‘).style.display="none";
          
            }
           
             if (obj.id=="M_3")
            {
           
              document.getElementById(‘M_1‘).style.display="none";
              document.getElementById(‘M_2‘).style.display="none";
              document.getElementById(‘M_4‘).style.display="none";
          
            }
           
             if (obj.id=="M_4")
            {
           
              document.getElementById(‘M_1‘).style.display="none";
               document.getElementById(‘M_2‘).style.display="none";
              document.getElementById(‘M_3‘).style.display="none";
           
            }
            }catch(e)
            {
            }
          var oStyle = obj.style;
          oStyle.display == "none" ? oStyle.display = "block" : oStyle.display = "none";
         }

</script>

html代码

  <div>

 <table>

 <tr onclick="showHide(M_1)">

<td>下拉框1</td>

</tr>

 <tr>

<td>

<table id="M_1">

<tr><td>列表1</td></tr>

</table>

</td>

</tr>

<tr>

<td>

<table id="M_2">

<tr><td>列表2</td></tr>

</table>

</td>

</tr>

<tr>

<td>

<table id="M_3">

<tr><td>列表3</td></tr>

</table>

</td>

</tr>

<tr>

<td>

<table id="M_4">

<tr><td>列表4</td></tr>

</table>

</td>

</tr>

</table>

</div>

table+js实现网站左侧列表下拉隐藏

原文:http://www.cnblogs.com/zlqblog/p/4029204.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!