如何使用jQuery滚动到特定项目？

小编典典

如何使用jQuery滚动到特定项目？

javascript

我有一张带垂直滚动条的大桌子。我想使用jQuery / Javascript滚动到此表中的特定行。有内置的方法可以做到这一点吗？

div {

    width: 100px;

    height: 70px;

    border: 1px solid blue;

    overflow: auto;

}


<div>

    <table id="my_table">

        <tr id='row_1'><td>1</td></tr>

        <tr id='row_2'><td>2</td></tr>

        <tr id='row_3'><td>3</td></tr>

        <tr id='row_4'><td>4</td></tr>

        <tr id='row_5'><td>5</td></tr>

        <tr id='row_6'><td>6</td></tr>

        <tr id='row_7'><td>7</td></tr>

        <tr id='row_8'><td>8</td></tr>

        <tr id='row_9'><td>9</td></tr>

    </table>

</div>

阅读 354

2020-05-01

共1个答案

小编典典

死了很简单。 无需插件 。

var $container = $('div'),
    $scrollTo = $('#row_8');

$container.scrollTop(
    $scrollTo.offset().top - $container.offset().top + $container.scrollTop()
);

// Or you can animate the scrolling:
$container.animate({
    scrollTop: $scrollTo.offset().top - $container.offset().top + $container.scrollTop()
});

文档scrollTop。

2020-05-01