隐藏行的代码

来源：互联网发布：网络社会工程学编辑：程序博客网时间：2024/06/11 19:10

<title>无标题文档 </title>
</head>
<body>
<table width="100%" border="1" cellspacing="0" cellpadding="0" id="tab">
<tr>
    <td>姓名 </td>
    <td>性别 </td>
    <td>年龄 </td>
    <td>学科 </td>
    <td>分数 </td>
</tr>
<tr>
    <td>张强 </td>
    <td>男 </td>
    <td>22 </td>
    <td>数学 </td>
    <td>90 </td>
</tr>
<tr>
    <td>张三 </td>
    <td>男 </td>
    <td>22 </td>
    <td>数学 </td>
    <td>90 </td>
</tr>
<tr>
    <td>张三 </td>
    <td>男 </td>
    <td>22 </td>
    <td>语文 </td>
    <td>70 </td>
</tr>
<tr>
    <td>张三 </td>
    <td>男 </td>
    <td>22 </td>
    <td>英语 </td>
    <td>60 </td>
</tr>
<tr>
    <td>李四 </td>
    <td>女 </td>
    <td>19 </td>
    <td>数学 </td>
    <td>60 </td>
</tr>
<tr>
    <td>李四 </td>
    <td>女 </td>
    <td>19 </td>
    <td>语文 </td>
    <td>60 </td>
</tr>
<tr>
    <td>王五 </td>
    <td>男 </td>
    <td>19 </td>
    <td>英语 </td>
    <td>60 </td>
</tr>
</table>
<script >
    var tab=document.getElementById("tab");
    var name="";
    for(var i=0,j=0;i <tab.rows.length;i++,j++) {
        if(name==tab.rows[i].cells[0].innerHTML) {
            tab.rows[i].deleteCell(0)
        } else {
            name=tab.rows[i].cells[0].innerHTML;
            if(i>0)tab.rows[i-j].cells[0].rowSpan=j;
            j=0;
        }
    }

</script >
<script language="javascript">
function HideTr()
   {
var tab=document.getElementById("tab");
for(var i=0;i <tab.rows.length;i++) {
      var cell = tab.rows[i].cells[0];
      if(cell.rowSpan > 1)
      {
               //cell.rowSpan = 1;

      }
        }
if(tab.rows[2].style.display == "")
{
  tab.rows[2].style.display = "none";
  tab.rows[3].style.display = "none";
  tab.rows[4].style.display = "none";
}else{

  tab.rows[2].style.display = "";
  tab.rows[3].style.display = "";
  tab.rows[4].style.display = "";
  tab.rows[2].cells[0].rowSpan = 3;
}

    }
</script>
<input type="button" value=OK onclick="HideTr()" />
</body>
</html>