javascript - 如何可靠地跟踪动态更新的 HTML 表格的底部?

标签 javascript jquery html css twitter-bootstrap

我在 SO 上阅读过关于如何执行此操作的类似问题,但我的设置略有不同,针对这些问题提出的解决方案产生了奇怪的结果。

在我的页面上,我有一个 DIV,它的高度是固定的,我给了它 ID table-container。正如 ID 所示,它包含一个表 (id="myTable"),每隔几秒使用 JavaScript 在底部附加一行。我试图实现的效果是,随着表格大小的增长,超出表格容器的大小,表格容器 DIV 将向下滚动,以便最后一行始终可见。

我使用了以下 JavaScript 来实现这一点:

$('#table-container').scrollTop ($('#myTable tr:last').position().top);

这对于前 20 行左右的添加工作正常,但之后它完全失去对底行的跟踪。我不明白为什么一开始这么好,然后就搞砸了。

我创建了一个 JSFiddle 来说明问题。 https://jsfiddle.net/crickes/meqzf4g1/16/

最佳答案

为什么你不能只做 $('#table-container').scrollTop ($('#myTable').height() );

关于javascript - 如何可靠地跟踪动态更新的 HTML 表格的底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30405761/

相关文章:

javascript - setTimeinterval 内的 Jquery setTimeout 不起作用

javascript - 无法正确访问 json github api 响应

javascript - 强制刷新浏览器中的部分页面

javascript - FullCalendar:跳转到第一个事件

javascript - 如何使 jQuery POST 函数打开新页面?

javascript - 如何使用动画 JQuery

javascript - 在 webkit(或 electron)中禁用捏合缩放

javascript - HTML 内容中的 HTML

javascript - _.debounce 函数在多个输入上的奇怪行为

javascript - 是否有可能css显示:block after jquery display:none?