我有这个输入元素：
<input type="text" class="textfield" value="" id="subject" name="subject">
然后我还有一些其他元素，比如其他标签的&<textarea>标签等等。。。
当用户点击＜input id=“#subject”＞时，页面应该滚动到页面的最后一个元素，并且应该使用一个漂亮的动画（应该滚动到底部而不是顶部）。
页面的最后一项是带有#submit的提交按钮：
<input type="submit" class="submit" id="submit" name="submit" value="Ok, Done.">
动画不应该太快，应该是流畅的。
我正在运行最新的jQuery版本。我宁愿不安装任何插件，而是使用默认的jQuery特性来实现这一点。
当前回答
如果您对平滑滚动效果不太感兴趣，而只是对滚动到特定元素感兴趣，则不需要使用jQuery函数。Javascript已涵盖您的案例：
https://developer.mozilla.org/en-US/docs/Web/API/element.scrollIntoView
因此，您需要做的就是：$（“selector”）.get（0）.scrollIntoView（）；
使用.get（0）是因为我们希望检索JavaScript的DOM元素，而不是JQuery的DOM元素。
更新
现在可以通过滚动选项滚动动画（参见MDN）。您甚至可以控制块的位置。除了Safari，它似乎有很大的支持
$("selector").get(0).scrollIntoView({behavior: 'smooth'});
其他回答
var scrollTo = function($parent, $element) {
var topDiff = $element.position().top - $parent.position().top;
$parent.animate({
scrollTop : topDiff
}, 100);
};
这在没有jQuery的情况下是可以实现的：
document.getElementById("element-id").scrollIntoView();
在大多数情况下，最好使用插件。认真地我要在这里兜售我的。当然还有其他的。但请检查他们是否真的避免了那些你首先想要插件的陷阱——并不是所有人都这样做。
我写过在其他地方使用插件的原因。简而言之，这里大多数答案的基础是一行
$('html, body').animate( { scrollTop: $target.offset().top }, duration );
是糟糕的用户体验。
动画不会响应用户操作。即使用户单击、轻击或尝试滚动，它也会继续。如果动画的起点接近目标元素，则动画会非常缓慢。如果目标元素位于页面底部附近，则无法滚动到窗口顶部。然后，滚动动画在中间运动时突然停止。
为了处理这些问题（以及其他一些问题），您可以使用我的插件jQuery.scrollable
$( window ).scrollTo( targetPosition );
就这样。当然，还有更多的选择。
关于目标位置，在大多数情况下，$target.offset（）.top完成任务。但是请注意，返回的值没有考虑html元素上的边框（请参见本演示）。如果你需要目标位置在任何情况下都准确，最好使用
targetPosition = $( window ).scrollTop() + $target[0].getBoundingClientRect().top;
即使在html元素上设置了边框，这也能正常工作。
假设您有一个带有id按钮的按钮，请尝试以下示例：
$("#button").click(function() {
$([document.documentElement, document.body]).animate({
scrollTop: $("#elementtoScrollToID").offset().top
}, 2000);
});
我从没有jQuery插件的文章平滑滚动到一个元素中得到了代码。我已经在下面的示例中测试了它。
<html><script src=“https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js“></script><脚本>$（文档）.ready（函数（）{$（“#click”）.click（函数（）{$（'html，body'）.animate({scrollTop:$（“#div1”）.offset（）.top}, 2000);});});</script><div id=“div1”style=“height:1000px；width 100px”>测验</div><br/><div id=“div2”style=“height:1000px；width 100px”>测试2</div><button id=“click”>单击我</button></html>
如果只处理滚动到输入元素，则可以使用focus（）。例如，如果要滚动到第一个可见输入：
$(':input:visible').first().focus();
或容器中第一个可见的输入，类为.error：
$('.error :input:visible').first().focus();
感谢Tricia Ball指出这一点！
