蒋为的空间

我们一直在努力....

html表格行和列的隐藏和显示

标签: html表格行和列的隐藏和显示

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">    
<HTML>    
<HEAD>    
<TITLE> 显示隐藏列 </TITLE>    
<SCRIPT LANGUAGE="JavaScript">    
<!--    
function setHiddenCol(oTable,iCol)  
{    
    for (i=0;i < oTable.rows.length ; i++)    
    {    
        oTable.rows[i].cells[iCol].style.display = oTable.rows[i].cells[iCol].style.display=="none"?"block":"none";    
    }    
}    
function setHiddenRow(oTable,iRow)
{    
    oTable.rows[iRow].style.display = oTable.rows[iRow].style.display == "none"?"block":"none";    
}    
//-->    
</SCRIPT>    
</HEAD>    
    
<BODY>    
<TABLE id="Table1" cellSpacing="1" cellPadding="1" border="1">     
<TR>
 <TD width="20%">00</TD>
 <TD width="20%" bgcolor="#E3E3E3">01</TD>
 <TD width="20%">02</TD>
</TR>    
<TR>
  <TD width="20%" bgcolor="red">10</TD>
 <TD width="20%" bgcolor="green"><input type='text' id='a' name='a'></TD>
 <TD width="20%" bgcolor="red">12</TD>
</TR>    
<TR>
 <TD width="20%">20</TD>
 <TD width="20%" bgcolor="#E3E3E3">21</TD>
 <TD width="20%">22</TD>
</TR>    
</TABLE>

<INPUT id="btnHiddenCol" type="button" value="显示/隐藏第2列" name="btnHiddenCol" onclick="setHiddenCol(document.getElementById('Table1'),1)">     
<INPUT id="btnHiddenRow" type="button" value="显示/隐藏第2行" name="btnHiddenRow" onclick="setHiddenRow(document.getElementById('Table1'),1)">     
</BODY>    
</HTML> 

附件:


    评分: 请先登录再投票,同一篇博客一月只能投票一次!
    无人投票

评论


发表评论

验证码:
最近访客
关注此文的人们还关注