javascript Jquery使div始终滚动到底部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10899632/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jquery make div always scroll to bottom
提问by pangi
I have a div that contains a table. This table is dynamically updated, and is filling up with data as user is using our website. Is it possible to force this div to always be scrolled to bottom? So that the user will always be able to see the bottom most table row that was added. Thank you!
我有一个包含表格的 div。该表是动态更新的，并在用户使用我们的网站时填充数据。是否可以强制此 div 始终滚动到底部？这样用户将始终能够看到添加的最底部的表格行。谢谢！
回答by Alex Pakka
That would be something like
那会是这样的
...onRowAdded = function() {
$('#myTable').animate({scrollTop: $('#myTable').attr('scrollHeight')});
};
Note, if the rows are added very often, you would want to use setTimeout with blocking variable check at the beginning to prevent scrolling down more often than twice per second or so. This technique is discussed e.g. here
请注意，如果经常添加行，您可能希望在开始时使用 setTimeout 和阻塞变量检查，以防止向下滚动的频率超过每秒两次左右。例如这里讨论了这种技术
UPDATE
更新
Starting with jQuery 1.6 it is better to use .prop() instead of .attr() (see comments to this question):
从 jQuery 1.6 开始，最好使用 .prop() 而不是 .attr() （请参阅对此问题的评论）：
onRowAdded = function() {
$('#myTable').animate({scrollTop: $('#myTable').prop('scrollHeight')});
};
回答by charlietfl
Set the update element as position absolute and bottom:0
将更新元素设置为绝对位置和底部：0
回答by Guilherme de Jesus Santos
Try something like it :
尝试类似的东西：
Create a anchor like <a id='bottomDiv'></a>and insert a javascript like this document.getElementById('bottomOfDiv').scrollIntoView(true);
创建一个像这样的锚点<a id='bottomDiv'></a>并像这样插入一个 javascriptdocument.getElementById('bottomOfDiv').scrollIntoView(true);
I made a example here http://jsfiddle.net/PTmpL/1/
我在这里做了一个例子 http://jsfiddle.net/PTmpL/1/
回答by naren
I think this could be the easy solution !!!
我认为这可能是最简单的解决方案！！！
element.scrollTo(element.get(0).scrollHeight);
回答by Adam Sweeney
Follow this tutorial
按照本教程
http://jqueryfordesigners.com/fixed-floating-elements/
http://jqueryfordesigners.com/fixed-floating-elements/
but use the bottomcss property to have the bottom most element, visible on the page
但是使用bottomcss 属性来获得最底部的元素，在页面上可见
element{
bottom:0;
}
element{
bottom:0;
}
回答by gereeter
I'd recommend using the ScrollTo JQuery plugin. Just use
我建议使用ScrollTo JQuery 插件。只需使用
element.scrollTo('max', {axis: 'y'});
or
或者
element.scrollTo('max', duration, {axis: 'y'});
This plugin has the added benifit of having a nice smooth scroll.
这个插件有一个很好的平滑滚动的额外好处。
