jquery - 使用 jquery 在 div 内滚动

Question

我有一个<div>与 overflow:auto 。这个<div>包含 <form>带有搜索栏。我正在以相同的形式显示获取的记录，现在我需要的只是滚动 <div> (我的搜索结果开始显示的地方)到其容器的顶部 <div> (而不是到页面顶部)。

检查创建的jsfiddle。 http://jsfiddle.net/tusharjs/wGUE2/15/

在这里，我尝试了在 stackoverflow 上找到的解决方案，但它滚动了所需的 <div id="scrollto">到页面顶部而不是 <div id="maincontent"> 的顶部.

谢谢

Answer 1

您应该使用 .offset() 方法获取元素的实际顶部，并从滚动量中减去该值。

$(document).ready( function(){
  var elem = $('#scrollto');
  if(elem)
  {
    var main = $("#maincontent"),
        t = main.offset().top;
        main.scrollTop(elem.offset().top - t);
  }
});

Here's my fork of your fiddle

将滚动动画化可能会更令人印象深刻:

main.animate({scrollTop: elem.offset().top - t}, 500);

上面的第二个参数是以毫秒为单位的持续时间。更新后的示例为here .