javascript - 使用javascript隐藏或显示多个表

Question

我正在尝试在 JS 中创建一个函数，隐藏页面上除此列表中选择的表格之外的所有表格:

    echo '<FORM><SELECT id="listB" onchange="selecTable">';
    for ($i=0;$i<$size;$i++)
    {
        echo '<OPTION VALUE="'.$rows[$i][0].'">'.$rows[$i][1];
    }
    echo '</SELECT></FORM>';

我尝试在一个和两个函数中实现它，下面是一个函数版本:

    function selecTable(size)
    {                 
        var tab="tab"+document.getElementById("listeB").value;
        for (var i=0;i<=size;i++)
        {
            name="tab"+i;
            if (name===tab)
            {
                document.getElementById(name).style.display='';
            }else{
                document.getElementById(name).style.display='none';
        }
    }

以及我尝试显示/隐藏的表格的代码:

    for ($i=0;$i<$nbtab[0];$i++)
    {
        echo '<table  id="tab',$i+1,'" style="display:none"><thead><tr>
              <th>Column 1</th>
              <th>Column 2</th>
              <th>Column 3</th>
              <th>Column 4</th>
              <th>Column 5</th>
              </tr></thead><tbody>';
        for ($j=0;$j<sizeof($mytable);$j++)
        {
            if ($mytable[$j][0]==$rows[$i][0])
            {
                echo '<tr><td>'.$mytable[$j][1].'</td> '
                    .'<td>'.$mytable[$j][2].'</td> '
                    .'<td>'.$mytable[$j][3].'</td> '
                    .'<td>'.$mytable[$j][4].'</td> '
                    .'<td>'.$mytable[$j][5].'</td></tr>';
            }
        }
        echo '</tbody></table>';
    }

这里的问题是我无法获得我想要显示的表格。我已经成功地使它们一一出现(通过注释“else”)，但是每次我尝试隐藏所有其他表时，脚本不再执行任何操作...这里有什么问题？

Answer 1

您正在为<option>分配不同的值元素和 <table> id。

echo '<OPTION VALUE="'.$rows[$i][0].'">'.$rows[$i][1];

<option>的值标签来自数据库值。并且，

 echo '<table  id="tab',$i+1,'" style="display:none"><thead><tr>

<table>的值id 是循环索引的计数器。确保它们相同以获得预期结果。