Jquery 让 div 总是滚动到底部答案

【问题标题】：Jquery make div always scroll to bottomJquery 让 div 总是滚动到底部
【发布时间】：2016-01-30 06:24:06
【问题描述】：

我有一个包含表格的 div。该表是动态更新的，并在用户使用我们的网站时填充数据。是否可以强制此 div 始终滚动到底部？这样用户将始终能够看到添加的最底部的表格行。谢谢！

【问题讨论】：

【解决方案1】：

应该是这样的

...onRowAdded = function() {
    $('#myTable').animate({scrollTop: $('#myTable').attr('scrollHeight')});
};

注意，如果经常添加行，您可能希望在开始时使用 setTimeout 和阻塞变量检查，以防止向下滚动的频率超过每秒两次左右。讨论了这种技术，例如here

更新

从 jQuery 1.6 开始，最好使用 .prop() 而不是 .attr() （参见 cmets 这个问题）：

onRowAdded = function() {
    $('#myTable').animate({scrollTop: $('#myTable').prop('scrollHeight')});
};

【讨论】：

您可能必须使用 .prop 而不是 .attr
@cmcculloh，你是对的 - 从 jQuery 1.6 开始，使用 .prop('scrollHeight') 更合适，因为它不是属性，即在 HTML 元素的属性中没有位置。

【解决方案2】：

将更新元素设置为绝对位置和底部：0

【讨论】：

【解决方案3】：

试试类似的东西：

创建一个类似<a id='bottomDiv'></a> 的锚点并插入一个类似document.getElementById('bottomOfDiv').scrollIntoView(true); 的javascript

我在这里做了一个例子 http://jsfiddle.net/PTmpL/1/

【讨论】：

【解决方案4】：

按照本教程进行操作

但使用bottom css 属性使最底部的元素在页面上可见

element{ bottom:0; }

【讨论】：

【解决方案5】：

我建议使用ScrollTo JQuery plugin。只需使用

element.scrollTo('max', {axis: 'y'});

或

element.scrollTo('max', duration, {axis: 'y'});

这个插件还有一个额外的好处是滚动很流畅。

【讨论】：

【解决方案6】：

我认为这可能是一个简单的解决方案！！！

element.scrollTo(element.get(0).scrollHeight);

【讨论】：