时间戳

首页 > 解决方案 > 第一次调用 Setinterval() 后滚动到 div 的底部

javascript - 第一次调用 Setinterval() 后滚动到 div 的底部

问题描述

我做了一个固定高度的评论部分，overflow-y: scroll我想在那里加载一些带有setInterval函数的评论。

我的代码的问题是，每updateMessages调用一次，它就会将我滚动到底部并且我无法向上滚动，因为每一秒我都会被送回底部。如何使用滚动的 div 加载消息，然后在setinterval不向下滚动的情况下启动功能？

<script>
  setInterval(function(){
    updateMessages();
  },1000);
  function updateMessages(){
    $.ajax({
      url: 'includes/display_discussions.php?id=<?php echo $_GET['id']; ?>',
      type: 'POST',
      success: function(show_messages){
                 if(!show_messages.error){                               
                   $("#scroll_down").html(show_messages);
                   var div = document.getElementById("scroll_down");
                   div.scrollTop = div.scrollHeight;
                 }
               }
    });
   }    
</script>

标签： javascriptajax

解决方案

加载消息后，您可以切换一个布尔值，并使用它仅在第一种情况下滚动。然后您可以updateMessages在页面加载时手动调用一次，并setInterval每 30 秒调用一次：

var messagesLoaded = false;

function updateMessages() {
  $.ajax({
    url: 'includes/display_discussions.php?id=<?php echo $_GET["id"]; ?>',
    type: "POST",
    success: function(show_messages) {
      if (!show_messages.error) {
        $("#scroll_down").html(show_messages);

        if (!messagesLoaded) {
          messagesLoaded = true;
          var div = document.getElementById("scroll_down");
          div.scrollTop = div.scrollHeight;
        }
      }
    }
  });
}

document.addEventListener("DOMContentLoaded", updateMessages);

setInterval(updateMessages, 30000);

推荐阅读