如何在网页注册中分层（隐藏内容），详细见内容

我需要做一个注册的页面
然后注册的时候有几种选项，比如注册类型有“学生”“教师”“游客”
然后选择注册学生出现一些信息需要填写
注册教师有另外一些信息填写
游客又不一样所以急求一段隐藏的代码啊

解决方案 »

  1.   

    用单选实现选择类型   不同的选择可以不同的panel显示
      

  2.   

    把不同的输入信息放入各自的DIV 或 TD 中，
    根据用户选择的登录类型，设置元素的可见性。
      

  3.   

    通过JavaScript根据选择注册类型的不同，动态显示或者隐藏div
      

  4.   

    最好看下原理：
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <style type="text/css">
    body{ font-size:12px;}
    .l{ width:700px; line-height:20px; border-bottom:1px dashed #ccc;}
    .regblock{width:700px; line-height:50px; border-bottom:1px dashed #ccc; color:#F00; display:none;}
    </style>
    <script language="javascript">
    function cregstate(index)
    {
    var items=document.getElementById("regpanal").childNodes;
    for(var i=0;i<items.length;i++)
    {
    items[i].style.display="none";
    }
    document.getElementById("reg"+index).style.display="block";
    }
    </script>
    </head>
    <body>
    <div class="l"><span>注册类型：</span>
      <label><input onclick="cregstate(0)" name="zzlx" value="学生" type="radio" />学生</label>
      <label><input onclick="cregstate(1)" name="zzlx" value="教师" type="radio" />教师</label>
      <label><input onclick="cregstate(2)" name="zzlx" value="游客" type="radio" />游客</label>
    </div>
    <div id="regpanal">
    <div class="regblock" id="reg0">学生注册需要填写的选项</div>
    <div class="regblock" id="reg1">教师注册需要填写的选项</div>
    <div class="regblock" id="reg2">游客注册需要填写的选项</div>
    </div>
    </body>
    </html>
      

  5.   

    jS控制DIV的隐藏显示
    div.style.display=div.style.display=="none"?"block":"none";  
    或使用as:panel
      

  6.   

    1.把这三个部分的注册信息分别写在三个不同的层里面
    2.然后用js脚本控制层的现实
      document.getElementById("div1").style.display="none";  //影藏
      document.getElementById("div1").style.display="";  //显示  写block或者空的""都是显的意思3.如果要在后台代码中控制，也只要在后台注册脚本就可以了。例如:
    Response.Write("<script>document.getElementById(/"div1/").style.display="none";  </script>")