我正在使用Ajax请求创建聊天,我试图让消息div滚动到底部没有太多运气。

我将所有内容都包装在这个div中:

#scroll {
    height:400px;
    overflow:scroll;
}

是否有一种方法来保持它滚动到底部默认使用JS?

有办法保持它滚动到ajax请求后的底部吗?


当前回答

平滑滚动Javascript:

. getelementbyid(“信息”)。scrollIntoView({behavior: 'smooth', block: 'end'});

其他回答

如果你不想依赖scrollHeight,下面的代码可以帮助你:

$('#scroll').scrollTop(1000000);

使用jQuery动画:

$('#DebugContainer').stop().animate({
  scrollTop: $('#DebugContainer')[0].scrollHeight
}, 800);

滚动到div内的最后一个元素:

myDiv.scrollTop = myDiv.lastChild.offsetTop

这将允许您根据文档高度向下滚动

$('html, body').animate({scrollTop:$(document).height()}, 1000);

Css只有:

.scroll-container {
  overflow-anchor: none;
}

使滚动条在添加子元素时不会停留在顶部。例如,当聊天底部添加新消息时,滚动聊天到新消息。