Div Overflow Scroll-bottom:有可能吗？

Question

如果我有一个divwith overflow:auto这样它是一个可滚动的div我加载它的信息,使得一个重要的滚动区域,有没有办法,当我加载信息,div显示底部结果？或者基本上滚动到底部？

我见过jQuery解决方案,但这是用于HTA所以我不能使用jQuery.有没有纯粹的JavaScript方式来实现这一目标？

Answer 1

var myDiv = document.getElementById('myDiv');
myDiv.scrollTop = myDiv.scrollHeight;

在Firefox,Safari,Opera或Chrome浏览器,甚至IE浏览器,这是比我能说的SSE测试情况下,我设置了...哈哈

我将免除你对其他人提供的迟钝解决方案的咆哮,这里是一个可用于即时消息类型客户端的代码示例.

document.body.onload = function()
{
    var myDiv = document.getElementById('myDiv');
    // Pick your poison below, server sent events, websockets, AJAX, etc.
    var messageSource = new EventSource('somepage');
    messageSource.onmessage = function(event)
    {
        // You must add border widths, padding and margins to the right.
        var isScrolled = myDiv.scrollTop == myDiv.scrollHeight - myDiv.offsetHeight;
        myDiv.innerHTML += event.data;
        if(isScrolled)
            myDiv.scrollTop = myDiv.scrollHeight;
    };
};

该示例中相关的部分检查div是否已经滚动到底部,如果是,则在向其添加数据后将其滚动到底部.如果它尚未滚动到底部,则div的滚动位置将保持不变,以便div的可见内容不受添加数据的影响.

Answer 2

document.getElementById('mydiv').scrollTop = 9999999;

该scrollTop属性指定从区域顶部开始的滚动偏移(以像素为单位).将其设置为非常大的值将强制它到底部.