如何让我的溢出div滚动始终在底部？

Question

我用过

$('.chatroom-upper-container').scrollTop($('.chatroom-upper-container')[0].scrollHeight);

它仅在我发送新消息时才会起作用，滚动将更新到底部，但是当加载页面时，div滚动总会如何下降？

https://jsfiddle.net/729jz8me/

Everting在JsFiddle

中正常工作

但是在我的页面中，当加载页面时，卷轴不会转到底部 这是我的页面

当我发送新邮件时，滚动条将会关闭，那么如何使页面加载，滚动条将会显示在底部？

修改 也许我并没有非常明确地陈述这个问题。所以我想要的是当我打开页面时，滚动将位于底部。 现在我可以在发送新消息时转到页面底部但是当我关闭它时再次重新打开页面的滚动将再次排在最前面。我不确定为什么我的代码不能在JsFiddle

的页面上工作

Answer 1

请你试试jQuery代码： -

$(document).ready(function(){
   setTimeout(function(){
      $('.chatroom-upper-container').scrollTop($('.chatroom-upper-container')[0].scrollHeight);
   }, 500);
});

它可能对你有帮助。

Answer 2

我们可以将我的想法与你的想法结合起来：

• 使用您的代码

启动底部的列表

• 创建一个触发事件的按钮，当用户点击按钮时，滚动到达底部。

因此，当我们第一次启动页面时，列表将位于底部，然后当您发送消息时，列表也将位于底部。

$(document).ready(function(){
   //When page is loaded the first time
   $('.chatroom-upper-container').scrollTop($('.chatroom-upper-container')[0].scrollHeight);
   //Thus when page is loaded, the list started at the top 
   $('.YourSendButton').click(function(){
       $('.chatroom-upper-container').scrollTop($('.chatroom-upper-container')[0].scrollHeight);
   });  
});