急！！！！在javascript中如何实现活页夹的效果

用层可以的
就是隐藏一些，显示另一些
dw里边可以不编程实现的

解决方案 »

  1.   

    试试:
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>TabPages</title>
    <style>
    .tab{border:1 solid #000000;border-top:0}
    .menu{
    border:1 solid #000000;border-bottom:0;background-color:buttonface;
    text-align:center;font-weight:bold;font-size:12px;cursor:default;
    }
    </style>
    </head>
    <!--
    ********By Fason(2003-5-24)***********
    -->
    <body>
    <script defer>
    function expand(o){
    var i=o.cellIndex
    for(j=0;j<4;j++){
    eval("tabpage"+j).style.display='none'
    eval("menu"+j).style.cssText="border:1 solid #000000"
    }
    eval("tabpage"+i).style.display=''
    o.style.cssText="border-bottom:0"
    }
    expand(menu0)
    </script>
    <table border="0" width="200" cellspacing="0" cellpadding="0" class="tab">
      <tr>
        <td width="25%" class="menu" id=menu0 onclick="expand(this)">tab1</td>
        <td width="25%" class="menu" id=menu1 onclick="expand(this)">tab2</td>
        <td width="25%" class="menu" id=menu2 onclick="expand(this)">tab3</td>
        <td width="25%" class="menu" id=menu3 onclick="expand(this)">tab4</td>
      </tr>
      <tr>
        <td width="100%" colspan="4" height="200" bgcolor="buttonface">
        <table border=0 width="100%" height=100% cellspacing="0" cellpadding="0" id=tabpage0>
       <tr>
        <td width="100%">你好，我是Fason</td>
       </tr>
    </table>
        <table border=0 width="100%" height=100% cellspacing="0" cellpadding="0" id=tabpage1 style="display:none">
       <tr>
        <td width="100%">这个是简单版</td>
       </tr>
    </table>    
        <table border=0 width="100%" height=100% cellspacing="0" cellpadding="0" id=tabpage2 style="display:none">
       <tr>
        <td width="100%">扩展性不是很好</td>
       </tr>
    </table>
        <table border=0 width="100%" height=100% cellspacing="0" cellpadding="0" id=tabpage3 style="display:none">
       <tr>
        <td width="100%">大家多多改善！</td>
       </tr>
    </table>
    </td>
      </tr>
    </table>
    </body>
    </html>
    也有现成的控件
    http://www.csdn.net/Develop/Read_Article.asp?Id=15124