日期:2014-05-16  浏览次数:20430 次

这样的一个表格如何隐藏显示指定的行,麻烦大家了..
<table   width= "300 "   border= "2 "   cellspacing= "0 "   cellpadding= "0 ">
    <tr>
        <td   width= "100 "> a </td>
        <td   width= "100 "> 1 </td>
        <td   width= "100 "> 显示 </td>
    </tr>
    <tr>
        <td   width= "100 "> a </td>
        <td   width= "100 "> 2 </td>
        <td   width= "100 "> &nbsp; </td>
    </tr>
    <tr>
        <td   width= "100 "> a </td>
        <td   width= "100 "> 2 </td>
        <td   width= "100 "> &nbsp; </td>
    </tr>
    <tr>
        <td   width= "100 "> b </td>
        <td   width= "100 "> 1 </td>
        <td   width= "100 "> 显示 </td>
    </tr>
    <tr>
        <td   width= "100 "> b </td>
        <td   width= "100 "> 2 </td>
        <td   width= "100 "> &nbsp; </td>
    </tr>
    <tr>
        <td   width= "100 "> c </td>
        <td   width= "100 "> 1 </td>
        <td   width= "100 "> 显示 </td>
    </tr>
    <tr>
        <td   width= "100 "> c </td>
        <td   width= "100 "> 2 </td>
        <td   width= "100 "> &nbsp; </td>
    </tr>
    <tr>
        <td   width= "100 "> c </td>
        <td   width= "100 "> 2 </td>
        <td   width= "100 "> &nbsp; </td>
    </tr>
</table>

我要的效果是点击a和1旁边的显示时则显示所有a和2的行,再点击一下则隐藏有a和2的行,点有b和1旁边的显示时则显示所有b和2的行,再点击一下则隐藏有b和2的行

------解决方案--------------------
<html>
<head>
<title> </title>
<script language= "JavaScript ">
// td: 当前控制对象
// n: 控制行数
function A(td, n)
{
var newStatus;
if(td.innerText == "显示 ")
{
td.innerText = "隐藏 ";
newStatus = " ";
}
else
{
td.innerText = "显示 ";
newStatus = "none ";
}

var table = td.parentNode.parentNode.parentNode;
var tr = td.parentNode;
for(var i = tr.rowInd