Question

要向下滚动我的聊天DIV，我正在使用以下代码，该代码适用于Chrome＆amp; 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甚至没有在div1.clientHeight中显示TextBox2 :(任何其他方式来查找IE的高度？

Answer 1

我的建议是使用jQuery并使用其跨浏览器等效来获得高度。即$('#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>

DIV滚动条的跨浏览器问题

1 个答案: