javascript - 当表位于可滚动 div 中时，如何使用 jquery 使表行滚动到 View 中？

Question

使用滚动的 div:

<div id="PVwindow" style="overflow: scroll; max-width:800px; max-height:230px; float:left;">

如何将一行滚动到 View 中，例如:

<table id="PVtable"><tbody><tr>.....</tr>.....<tr id="scrollToViewP" style="background-color: #FFFF99;"><td>xxxx</td></tr></tbody></table>

这是不起作用的代码(它滚动但不在 View 中):

$( document ).ready(function() {
         if ($("#scrollToViewP:not(:visible)")) {
            $("#PVwindow").animate({
                  scrollTop: $("#scrollToViewP").offset().top
                 }, 1000);
                }
    });

这是一个jsfiddle working example that scrolls to the bottom

Answer 1

这是一个在大多数情况下都有效的解决方案(例如 80%)，有时它会滚动整个窗口以及 div。

<script>
$( document ).ready(function() {

    var element = document.getElementById("scrollToViewP");
    element.scrollIntoView({block: "end", behavior: "smooth"});

});

我仍然希望有人能够加入并改进这一点。 (适用于 FireFox 和 IE 11)