强制滚动条到底部

Question

我正在制作一个工作良好而且很好的小消息/聊天系统.问题是,<div>输出消息的方式不会按照我需要的方式滚动.

所有新消息都添加到div的底部,当添加更多消息并且滚动条显示时,滚动停留在顶部<div>.我需要将其反转,以便滚动始终贴在底部<div>.

我想要的一个很好的例子是Steam的聊天窗口,甚至是我用来填写问题的文本输入.

因为我想避免jQuery,这让我完全陷入困境.如果你能指出我正确的方向那将是伟大的!我不确定HTML和CSS是否可以处理这个问题,或者根本不需要JavaScript.

Answer 1

下面的Javascript代码应该像你描述的那样将div的滚动条放在底部:

var objDiv = document.getElementById("divExample");
objDiv.scrollTop = objDiv.scrollHeight;

此解决方案和更多信息可在以下链接中找到:http://web.archive.org/web/20080821211053/http : //radio.javaranch.com/pascarello/2005/12/14/1134573598403.html

Answer 2

我认为这是一个更好的解决方案：

element.scrollTop = element.scrollHeight - element.clientHeight;