jQuery - 使用overflow-y滚动div：scroll;

Question

我有一个包含消息列表的div（它是一个聊天室应用程序）。当每条消息都添加到列表的底部时，我想我想将div滚动到页面底部。这有道理，对吧？所以 - 问题＃1：如何让div滚动到底部？

现在，下一个问题是关于可用性的问题。如果用户向上滚动以阅读之前发布的内容，该怎么办？然后突然有人发布了新消息？这意味着jQuery将再次向下滚动。这对用户来说非常烦人。处理这个问题的好方法是什么？如果滚动条在添加新消息之前已经完全滚动，它是否应该向下滚动？如果是这样，如何在jQuery中做到这一点？还是有更实用的解决方案？

Answer 1

您可以按window.pageYOffset获取滚动条的位置，然后使用window.scrollTo(0, y)滚动到某个位置。

或者您甚至可以在jquery中使用$('#mydiv').scrollTop(newmsg_top)向下滚动到新消息。

其中var newmsg_top = parseInt($('#mydiv li:last').offset().top);

此处#mydiv是包含所有邮件的div   所以#mydiv li:last指向最后一条消息 offset()返回元素相对于文档的当前位置，您可以通过.top

获得最高排名

如果您想要相对于父母的相对位置，则可以使用position()

编辑： 在这里工作的jsfiddle here。请看一下。 注意：只有在查看最后一个元素时才会关闭（对于可用性问题的解决方案）

Answer 2

//在追加

之后，这将滚动到结尾

$("#mydiv").append("My data");
var newmsg_top = parseInt($('#mydiv')[0].scrollHeight );
$('#mydiv').scrollTop(newmsg_top);