javascript 修改DIV的高度

我自己做了一个用户控件，通过点击按钮来动态添加，现在遇到一个问题，我希望点击按钮的同时使得DIV的高度也增加，结果测试发现Firefox下点击按钮的时候高度增加了后马上又变回原来的高度了，而在IE6中高度可以持续增加，代码如下
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>无标题页</title>
    <script type="text/javascript">
    function AddHeight()
    {
       var div = document.getElementById("container");
       var height=div.clientHeight ;
       alert(height);
       height+=200;
       alert(height);
       div.style.height=height+"px";
    }
    </script>
</head>
<body>
    <form id="form1" runat="server">    <div id="container" runat="server" style="width:700px;height:200px; background-color:#469ff3"></div>
    <div style=" background-color:Red;">
        <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click1" OnClientClick="AddHeight()" />
    </div>
    <div>
        <asp:Label ID="txt" runat="server" Text=""></asp:Label></div>
    </form>
</body>
</html>Firefox下的效果是：先弹出200，然后弹出400，DIV的高度变为400然后又立刻变为200，不论点击按钮多上次都是这样，请高手赐教

解决方案 »

  1.   

    FF 3.0.4 测试正常L@_@K
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>无标题页 </title>
        <script type="text/javascript">
        function AddHeight()
        {
          var div = document.getElementById("container");
          var height=div.clientHeight ;
          alert(height);
          height+=200;
          alert(height);
          div.style.height=height+"px";
        }
        </script>
    </head>
    <body>
        <form id="form1" runat="server">    <div id="container" runat="server" style="width:700px;height:200px; background-color:#469ff3"> </div>
        <div style=" background-color:Red;">
    <input type="button" value="Button" onclick="AddHeight()" />
        </div>
        <div>
    </div>
        </form>
    </body>
    </html>
      

  2.   

    在div.style.height=height+"px"; 下面加一个return false;
      

  3.   

    还有一个小问题，我安装了几个浏览器，在firefox和opera以及IE6下都有反应（可以动态添加控件和用alert（）弹出数值），而在“世界之窗”和“遨游”下点击按钮没有任何反应呢，我这个网站是要拿出来用的，如果用户正好用的这两种浏览器该怎么办
      

  4.   

    有测试了几次，“世界之窗”和“遨游”、IE都可以怎家DIV的高度，但是Firefox和opera 仍然不行，即使按2楼的“在div.style.height=height+"px"; 下面加一个return false;”修改后还是不行
      

  5.   

    你动态的改变页面的高度，只要页面不刷新，肯定是可以的，但是这个动态增长的高度并没有真正的保存早页面上，你页面递交了服务器，然后在显示的时候，页面已经刷新了，高度就会回复到从前！这种效果，你最好用ajax实现无刷新，动态增长div的高度，其内容是通过ajax方式从后台获取！
      

  6.   

    parseInt(obj.style.height)这样才可以.FF下通常是有PX的,如33px
    有可能它把这个当成字符串了,而不是数值.