如何隐藏label并保持位置不变？求救！！

<input type=button value="隐藏自己显示别人1" name=a1 onclick="this.style.visibility='hidden';document.all.a2.style.visibility='visible';">
<input type=button value="隐藏自己显示别人2" name=a2 onclick="this.style.visibility='hidden';document.all.a1.style.visibility='visible';">
隐藏后还占空间，请用visibility属性

解决方案 »

  1.   

    再试试：
    index.htm:
    <html><head>
    <meta http-equiv="Content-Language" content="zh-cn">
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Demo</title>
    </head><body>
    <script language="JavaScript">
    function showForm()
    {
    if(parent.rightFrame.divForm.style.display=="none")
    parent.rightFrame.divForm.style.display="";
    else
    parent.rightFrame.divForm.style.display="none";

    if(document.all.label1.style.display=="none")
    document.all.label1.style.display="";
    else
    document.all.label1.style.display="none";
    }
    </script>
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="45%"><table border="0" width="100%" id="table1">
          <tr>
            <td><div id="divForm2">
              <p align="right"> <label id="label2">&nbsp;&nbsp;</label><font color="#FF0000">
                <label id="label1" onClick="showForm()" style="display:''">Upload
              </font>    
            </div></td>
          </tr>
          <tr>
            <td><table border="1" width="100%" id="table2">
                <tr>
                  <td>　</td>
                </tr>
                <tr>
                  <td>　</td>
                </tr>
                <tr>
                  <td>　</td>
                </tr>
                <tr>
                  <td>　</td>
                </tr>
            </table></td>
          </tr>
        </table></td>
        <td width="55%"><iframe name="rightFrame" src="index2.htm" width="100%" height="170" align="right" frameborder="0"></iframe></td>
      </tr>
    </table>
    </body></html>
    index2.htm:<script language="JavaScript">
    function showForm2()
    {
    if(document.all.divForm.style.display=="none")
    document.all.divForm.style.display="";
    else
    document.all.divForm.style.display="none";

    if(parent.label1.style.display=="none")
    parent.label1.style.display="";
    else
    parent.label1.style.display="none";
    }
    </script><div id="divForm" style="display:none;">
    <table border="0" width="100%" id="table1">
    <tr>
    <td>　</td>
    </tr>
    <tr>
    <td>
    <table border="1" width="100%" id="table2">
    <tr>
    <td>　</td>
    </tr>
    <tr>
    <td>　</td>
    </tr>
    <tr>
    <td>　</td>
    </tr>
    </table>
    </td>
    </tr>
    <tr>
    <td>
    <p>
    <input type="submit" value="Abort" name="B1" onClick="showForm2()" style="float: right"></p>
    </td>
    </tr>
    </table>
    </div>
      

  2.   

    你让DIV隐藏和显示肯定下面的表格会顶上来的。。如上OK
      

  3.   

    用display的话，消失时，它就不占用空间位置了
    用visibility的话，不管显示与否，都占用此空间。楼主改用visibility吧，分别是hidden和visible这两个值就可以了
      

  4.   

    感谢JK_10000(JK)、xzq686(★_瞬_★) 、pli0825(女儿当自强)to xzq686(★_瞬_★):
    代码很受用，非常感谢！