请教高手：隐藏/显示表格问题

我想实际默认显示第一行，当选“显示后两行”时，则第一行不显示，点“显示第一行”时，后两行不显示。请教高手script代码该如何写。谢谢！ 
<input name="daibancz" type="radio" value="2" checked onclick="javascriptShowIt();">显示第一行 <input name="daibancz" type="radio" value="21" onclick="javascript:ShowIt1();">显示后两行 
  <table  border="1"  width="300">  
    <tr    id="col3"  style="display:">  
    <td>1行1列 </td>  
    <td>1行2列 </td>  
    <td>1行3列 </td>  
    </tr>  
    <tr  id="col1"  style="display:none">  
    <td>2行1列 </td>  
    <td>2行2列 </td>  
    <td>2行3列 </td>  
    </tr> 
<tr  id="col2"  style="display:none"> 
    <td>3行1列 </td>  
    <td>3行2列 </td>  
    <td>3行3列 </td>  
    </tr>  
  </table>  

解决方案 »

  1.   

    function ShowIt(){
        document.getElementById('col3').style.display = '';
        document.getElementById('col1').style.display = 'none';
        document.getElementById('col2').style.display = 'none';
    }function ShowIt1(){
        document.getElementById('col3').style.display = 'none';
        document.getElementById('col1').style.display = '';
        document.getElementById('col2').style.display = '';
    }
      

  2.   


    <html>
    <head>
    <script>
    function showOrDisplay()
    {
    var row = document.getElementById('col2');
    if(row.style.display == 'none')
    {
    row.style.display = 'block';
    }else
    {
    row.style.display = 'none';
    }
    }
    </script>
    </head>
    <body>
    <table cellpadding="0" cellspacing="0" border="1">
    <tr id="col1"><td>1</td><td>2</td><td>3</td></tr>
    <tr id="col2" style="display:none"><td>1</td><td>2</td><td>3</td></tr>
    </table>
    <input type="button" onclick="showOrDisplay()" value="click me">
    </body>
    </html>
      

  3.   


    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>新建网页 1</title>
    </head><body>
    <br> 
    <script language="javascript">
    <!--
    function ShowIt(id,arr){
    var TR=document.getElementById(id).rows
    for (var i=0;i<TR.length;i++)TR[i].style.display="none"
    for (var i=0;i<arr.length;i++)
    TR[arr[i]-1].style.display="block"}
    //-->
    </script>
    <input name="daibancz" type="radio" value="2" checked onclick="javascript:ShowIt('tab1',[1]);">显示第一行 
    <input name="daibancz" type="radio" value="21" onclick="javascript:ShowIt('tab1',[2]);">显示第二行 
    <input name="daibancz" type="radio" value="21" onclick="javascript:ShowIt('tab1',[3]);">显示第三行 
    <input name="daibancz" type="radio" value="21" onclick="javascript:ShowIt('tab1',[2,3]);">显示后两行 
    <input name="daibancz" type="radio" value="21" onclick="javascript:ShowIt('tab1',[1,2]);">显示前两行 
      <table  border="1"  width="300" id=tab1>  
        <tr style="display:">  
        <td>1行1列 </td>  
        <td>1行2列 </td>  
        <td>1行3列 </td>  
        </tr>  
        <tr style="display:none">  
        <td>2行1列 </td>  
        <td>2行2列 </td>  
        <td>2行3列 </td>  
        </tr>
        <tr style="display:none"> 
        <td>3行1列 </td>  
        <td>3行2列 </td>  
        <td>3行3列 </td>  
        </tr>  
      </table>  
    </body></html>