我正在处理一个文档文件。当单击 id="about" 的锚点时，我想滚动到 id="projectpage" 的所需部分。
<a class="nav-link page-scroll" href="" id="about">About Me</a>
<section id="aboutpage">
我尝试使用
$('a#about').click(function(){
$(window).scrollTo(0, document.getElementById('projectpage').offsetTop);
});
or even
$('#about').click(function(){
$(window).scrollTo(0, document.getElementById('projectpage').offsetTop);
});
但没有任何作用。
当我点击 id="about" 的锚点时，它只是将我重定向到 index.html（包含所有文档的主要 HTML）文件本身，而不是转到 id="projectpage" 的 offsetTop。
您需要防止锚点的默认行为......使用.preventDefault() https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault
并更换$(window)只是为了window...当您希望在窗口上应用普通 JS 方法时，您不需要 jQuery 来查找窗口。
$('#about').click(function(e) {
e.preventDefault()
window.scrollTo(0, document.getElementById('aboutpage').offsetTop);
});
section{
height: 200px;
border-top: 2px solid grey;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a class="nav-link page-scroll" href="" id="about">About Me</a>
<section id="somethingElse1">...</section>
<section id="somethingElse2">...</section>
<section id="somethingElse3">...</section>
<section id="aboutpage">About</section>
<section id="somethingElse4">...</section>
<section id="somethingElse5">...</section>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
