滚动到页面加载Div底部(jQuery)

我的页面上有一个div:

<div id='div1' style='overflow:scroll;overflow-x:hidden;max-height:200px;'></div>

我怎样才能使div滚动到div的底部??不是页面，只是DIV。

当前回答

这里的其他解决方案实际上并不适用于具有大量内容的div——它“最大”滚动到div的高度(而不是div内容的高度)。所以它们可以工作，除非你有超过div高度两倍的内容在里面。

下面是正确的版本:

$('#div1').scrollTop($('#div1')[0].scrollHeight);

或jQuery 1.6+版本:

var d = $('#div1');
d.scrollTop(d.prop("scrollHeight"));

或动画:

$("#div1").animate({ scrollTop: $('#div1').prop("scrollHeight")}, 1000);

其他回答

jquery的动画(版本> 2.0)

var d = $('#div1');
d.animate({ scrollTop: d.prop('scrollHeight') }, 1000);

下面是正确的版本:

$('#div1').scrollTop($('#div1')[0].scrollHeight);

或jQuery 1.6+版本:

var d = $('#div1');
d.scrollTop(d.prop("scrollHeight"));

或动画:

$("#div1").animate({ scrollTop: $('#div1').prop("scrollHeight")}, 1000);

我在这里看到的所有答案，包括目前“被接受”的答案，实际上都是错误的，因为他们设置了:

scrollTop = scrollHeight

而正确的方法是设置:

scrollTop = scrollHeight - clientHeight

换句话说:

$('#div1').scrollTop($('#div1')[0].scrollHeight - $('#div1')[0].clientHeight);

或动画:

$("#div1").animate({
  scrollTop: $('#div1')[0].scrollHeight - $('#div1')[0].clientHeight
}, 1000);

更新:请参阅Mike Todd的解决方案以获得完整的答案。

$("#div1").animate({ scrollTop: $('#div1').height()}, 1000);

如果你想让它变成动画(超过1000毫秒)。

$('#div1').scrollTop($('#div1').height())

如果你想要即时的。

当页面加载时，滚动是最大的值。

这是消息框，当用户发送消息时，总是显示最新的聊天，所以滚动值总是最大的。

$('#message').scrollTop($('#message')[0].scrollHeight);

见图片

推荐文章