DIV 滚动条的跨浏览器问题

Question

要向下滚动我的聊天 DIV，我使用以下代码，该代码在 Chrome 和 Chrome 中运行得很好。 FF。估计可以与除 IE 之外的所有其他流行浏览器一起正常工作。任何人都可以修改下面的代码或为我提供一些具有相同功能的其他代码（但应该具有跨浏览器支持）。

    <style type="text/css">
            #div2
            {
                width:250px;
                height:300px;
                background-color:Aqua;
                padding:10px;
                font-family:Calibri;
                overflow:auto;
            }
        </style>
        <script type="text/javascript">
            window.setInterval(function () {
                abc1();
            }, 10);

            function abc1() {
                var tb1 = document.getElementById('TextBox2');
                var div1 = document.getElementById('div1');
                var div2 = document.getElementById('div2');
                if (tb1.value != div1.clientHeight) {
                    div2.scrollTop = div2.scrollHeight;
                    tb1.value = div1.clientHeight;
                }
            }
        </script>
        <div id="div2">

                <div id="div1" runat="server"></div>
        </div>
<asp:TextBox ID="TextBox2" runat="server" style="visibility:hidden"></asp:TextBox>

服务器端代码：

while (dr.Read())
{
    String abc1 = dr[1].ToString();
    String abc2 = dr[2].ToString();
    div1.Controls.Add(new LiteralControl(abc1 + ":" + abc2 + "<br />"));
}

请随意使用 JavaScript/CSS/Ajax/jQuery/其他任何技术，但是滚动条如何在所有浏览器中以类似的方式表现？

编辑 1：

主要问题是 IE 甚至没有在 TextBox2 中显示 div1.clientHeight :( 还有其他方法可以找到 IE 的高度吗？

Answer 1

我的建议是使用 jQuery 并使用其跨浏览器等效项来获取高度。 ie $('#div1').outerHeight() - 这适用于 IE 以及所有其他浏览器。

---

更新 - 使用 jQuery 的代码

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript">
    window.setInterval(function () {
        abc1();
    }, 10);
    function abc1() {
        var tb1 = $('#TextBox2');
        var div1 = $('#div1');
        var div2 = $('#div2');
        if (tb1.val() != div1.outerHeight()) {
            div2.scrollTop(div2[0].scrollHeight);
            tb1.val(div1.outerHeight());
        }
    }
</script>