jQuery：移动窗口视口以显示新切换的元素

我在文档中有一段 jQuery 代码片段，它可以切换包含 a 的 divtextarea:

$('div#addnote-area').hide(); // hide the div
$('a#addnote-link').click(function() { // click event listener on link
     $('div#addnote-area').toggle(); // toggle the hidden div 
});

单击链接时切换工作正常。我遇到的问题是如果div#addnote-area位于浏览器当前视口下方，显示时它会保留在那里。我希望用户的光标转到文本区域，并且整个文本区域都可以在窗口中查看。

Without滚动插件

$(window).scrollTop($('div#addnote-area').offset().top)

EDIT:嗯，我确实从这个旧答案中得到了很多要点:)

这是一个奖励，这也可以是动画的。

只需使用animate()函数并定位 body 标签：

$('body').animate({scrollTop:$('div#addnote-area').offset().top},500)

在 Stackoverflow 上尝试一下！打开检查器控制台并运行

$('body').animate({scrollTop:$('#footer').offset().top},500)