设置滚动条位置 [英] Setting a scrollbar position

问题描述

我在div中有一个表（它是溢出的，所以浏览器呈现滚动条）。使用JavaScript，如何将轨道上的滚动条手柄移动到与表格中某一行的位置相对应的位置？

I have a table inside of a div (it's overflow, so the browser renders a scrollbar). Using JavaScript, how do I move the scrollbar handle along the track to a position that corresponds to the location of a row in the table?

+--------------------------------------+
|100                               |   |
|101                               |   |
|102                               |   |
|103                               |   |
|104                               |   |
|105     This is a table that      |---|
|106        has overflowed.        | - |  <-- I want to move this using JavaScript,
|107                               |---|      so that a specific row # is visible.
|108                               |   |
|109                               |   |
|110                               |   |
|111                               |   |
+--------------------------------------+

推荐答案

如果你想去非 jQuery方式，使用包含表的 scrollTop property 。

If you want to go the non-jQuery way, use the containing table's scrollTop property.

让我们假设您可以使用ID轻松识别要滚动到的行，以及包含< div /> 的内容。使用 offsetTop 要滚动的元素。

Lets assume you can easily identify the row you want to scroll to using an ID, along with the containing <div />. Use the offsetTop of the element you want to scroll to.

var container = document.getElementById('myContainingDiv');
var rowToScrollTo = document.getElementById('myRow');

container.scrollTop = rowToScrollTo.offsetTop;

这篇关于设置滚动条位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！