我有这个input元素：
<input type="text" class="textfield" value="" id="subject" name="subject">
然后我还有一些其他元素，比如其他文本输入、文本区域等。
当用户点击它input时#subject，页面应该滚动到页面的最后一个元素，并带有漂亮的动画。它应该是滚动到底部而不是顶部。
页面的最后一项是一个submit按钮，带有#submit：
<input type="submit" class="submit" id="submit" name="submit" value="Ok, Done.">
动画不应该太快并且应该是流畅的。
我正在运行最新的 jQuery 版本。我更喜欢不安装任何插件，而是使用默认的 jQuery 功能来实现这一点。
假设您有一个带有 id 的按钮button，请尝试以下示例：
$("#button").click(function() {
$([document.documentElement, document.body]).animate({
scrollTop: $("#elementtoScrollToID").offset().top
}, 2000);
});
我从文章Smoothly scroll to an element without a jQuery plugin 中得到了代码。我已经在下面的示例中对其进行了测试。
<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script>
$(document).ready(function (){
$("#click").click(function (){
$('html, body').animate({
scrollTop: $("#div1").offset().top
}, 2000);
});
});
</script>
<div id="div1" style="height: 1000px; width 100px">
Test
</div>
<br/>
<div id="div2" style="height: 1000px; width 100px">
Test 2
</div>
<button id="click">Click me</button>
</html> 
jQuery .scrollTo()：查看 - 演示、API、源代码
我编写了这个轻量级插件来使页面/元素滚动更容易。您可以灵活地传入目标元素或指定值。也许这可能是 jQuery 下一个正式版本的一部分，你怎么看？
示例用法：
$('body').scrollTo('#target'); // Scroll screen to target element
$('body').scrollTo(500); // Scroll screen 500 pixels down
$('#scrollable').scrollTo(100); // Scroll individual element 100 pixels down
选项：
scrollTarget：指示所需滚动位置的元素、字符串或数字。
offsetTop：定义滚动目标上方额外间距的数字。
持续时间：确定动画将运行多长时间的字符串或数字。
easing：一个字符串，指示用于过渡的缓动函数。
complete : 动画完成后调用的函数。
如果您对平滑滚动效果不太感兴趣，而只是对滚动到特定元素感兴趣，那么您不需要为此使用一些 jQuery 函数。Javascript 已经涵盖了您的案例：
https://developer.mozilla.org/en-US/docs/Web/API/element.scrollIntoView
所以你需要做的就是： $("selector").get(0).scrollIntoView();
.get(0) 使用它是因为我们想要检索 JavaScript 的 DOM 元素而不是 JQuery 的 DOM 元素。
这可以在没有 jQuery 的情况下实现：
document.getElementById("element-id").scrollIntoView();
使用这个简单的脚本
if($(window.location.hash).length > 0){
$('html, body').animate({ scrollTop: $(window.location.hash).offset().top}, 1000);
}
如果在 url 中找到散列标签，scrollTo 会根据 ID 设置动画。如果未找到哈希标记，则忽略该脚本。