滚动到div底部?

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

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

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

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

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

当前回答

像你一样，我正在构建一个聊天应用程序，并希望最近的消息滚动到视图中。这最终对我很有效:

//get the div that contains all the messages
let div = document.getElementById('message-container');

//make the last element (a message) to scroll into view, smoothly!
div.lastElementChild.scrollIntoView({ behavior: 'smooth' });

2020-07-08 07:48:43

其他回答

更新的方法，适用于所有当前浏览器:

this.scrollIntoView(false);

2014-10-10 07:08:29

在我的Angular 6应用中，我这样做了:

postMessage() {
  // post functions here
  let history = document.getElementById('history')
  let interval    
  interval = setInterval(function() {
    history.scrollTop = history.scrollHeight
    clearInterval(interval)
  }, 1)
}

clearInterval(interval)函数将停止计时器以允许手动上下滚动。

2020-02-17 00:21:16

Java脚本:

getElementById(‘messages)文件。scrollIntoView(虚假);

滚动到当前内容的最后一行。

2017-10-24 16:25:50

有时候最简单的就是最好的解决方案: 我不知道这是否有帮助，它帮助我在我想要的时候滚动它。“y=”越高，滚动越向下，当然“0”表示顶部，例如“1000”可能是底部，“2000”或“3000”等等，这取决于你的页面有多长。这通常在onclick或onmouseover按钮中起作用。