除非用户向上滚动，否则保持溢出 div 滚动到底部

Question

我有一个只有 300 像素大的 div，我希望它在页面加载时滚动到内容的底部。这个 div 有动态添加的内容，需要一直向下滚动。现在，如果用户决定向上滚动，我不希望它跳回底部，直到用户再次向下滚动

是否有可能让一个 div 保持滚动到底部，除非用户向上滚动并且当用户滚动回底部时，即使添加了新的动态内容，它也需要将自己保持在底部。我将如何去创造这个。

原文由 Robert E. McIntosh 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这可能会帮助您：

 var element = document.getElementById("yourDivID");
element.scrollTop = element.scrollHeight;

[编辑]，以匹配评论…

 function updateScroll(){
    var element = document.getElementById("yourDivID");
    element.scrollTop = element.scrollHeight;
}

每当添加内容时，调用函数 updateScroll()，或设置一个计时器：

 //once a second
setInterval(updateScroll,1000);

如果您只想在用户没有移动的情况下更新：

 var scrolled = false;
function updateScroll(){
    if(!scrolled){
        var element = document.getElementById("yourDivID");
        element.scrollTop = element.scrollHeight;
    }
}

$("#yourDivID").on('scroll', function(){
    scrolled=true;
});

原文由 Mr.Manhattan 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

这可能会帮助您：

 var element = document.getElementById("yourDivID");
element.scrollTop = element.scrollHeight;

[编辑]，以匹配评论…

 function updateScroll(){
    var element = document.getElementById("yourDivID");
    element.scrollTop = element.scrollHeight;
}

每当添加内容时，调用函数 updateScroll()，或设置一个计时器：

 //once a second
setInterval(updateScroll,1000);

如果您只想在用户没有移动时更新：

 var scrolled = false;
function updateScroll(){
    if(!scrolled){
        var element = document.getElementById("yourDivID");
        element.scrollTop = element.scrollHeight;
    }
}

$("#yourDivID").on('scroll', function(){
    scrolled=true;
});

原文由 Mr.Manhattan 发布，翻译遵循 CC BY-SA 4.0 许可协议