programing

데이터가 추가될 때 div 끝까지 자동 스크롤하는 방법은 무엇입니까?

telebox 2023. 8. 5. 10:04
반응형

데이터가 추가될 때 div 끝까지 자동 스크롤하는 방법은 무엇입니까?

나는 있습니다table의 내부에div다음 스타일을 사용합니다.

#data {
    overflow-x:hidden;
    overflow-y:visible;
    height:500px;
}

테이블에 충분한 데이터가 추가되면 세로 스크롤 막대가 표시됩니다.하지만, 새로운 데이터가 추가될 때, 나는 원합니다.div요소를 선택하여 맨 아래로 자동으로 이동합니다.

어떤 자바스크립트 코드를 사용할 수 있습니까?필요하다면 JQuery의 옵션을 선택할 수 있지만 JavaScript 솔루션을 선호합니다.

데이터가 언제 추가될지 모르는 경우#data요소의 스크롤을 업데이트하는 간격을 설정할 수 있습니다.맨 위에서 스크롤 높이로 몇 초 간격으로 설정할 수 있습니다.데이터가 추가되는 시기를 제어하는 경우에는 데이터가 추가된 후 다음 함수의 내부를 호출하기만 하면 됩니다.

window.setInterval(function() {
  var elem = document.getElementById('data');
  elem.scrollTop = elem.scrollHeight;
}, 5000);
var objDiv = document.getElementById("divExample");
objDiv.scrollTop = objDiv.scrollHeight;

언급URL : https://stackoverflow.com/questions/7303948/how-to-auto-scroll-to-end-of-div-when-data-is-added

반응형