jQuery：显示隐藏部分并导航到锚点
我创建了一个页面，其中包含一堆与特定 id 相关的 section 元素。该页面还有一个指向每个 section 的链接列表，如下所示：
<li><a class='subsection-nav gotoStep1' href='#step-1'>Step 1 Title</a></li>
我使用 jQuery 一次仅显示一个 section：
// Defaults
$('.document-subsection').hide();
$('.gotoStep1').addClass("active");
$('#step-1').show();
// Step 1
$('.gotoStep1').click(function() {
$('.subsection-nav').removeClass('active');
$('.gotoStep1').addClass("active");
$('.document-subsection').hide();
$('#step-1').show();
return false;
});
// Etc.
问题是，jQuery函数似乎覆盖了滚动到指定id的标准浏览器行为。我想点击链接来显示隐藏部分并导航到指定的id。我无法想象这会很难，我只是不知道该怎么做。
I created a page with a bunch of section elements keyed to specific ids. The page also has a list of links pointing to each section, like so:
<li><a class='subsection-nav gotoStep1' href='#step-1'>Step 1 Title</a></li>
I'm using jQuery to show only one section at a time:
// Defaults
$('.document-subsection').hide();
$('.gotoStep1').addClass("active");
$('#step-1').show();
// Step 1
$('.gotoStep1').click(function() {
$('.subsection-nav').removeClass('active');
$('.gotoStep1').addClass("active");
$('.document-subsection').hide();
$('#step-1').show();
return false;
});
// Etc.
The trouble is, the jQuery function seems to override the standard browser behavior of scrolling to the named id. I want clicking the link to both show the hidden section and navigate to the specified id. I can't imagine this would be very hard, I just don't know how.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
只需删除
onclick 回调中的 即可。这将允许浏览器执行默认功能，将页面导航到具有匹配 id 的元素。
Just remove the
in your onclick callback. This will allow the browser to perform the default function of navigating the page to the element with the matched id.
尝试
$(this).addClass("active");而不是$('.gotoStep1').addClass("active");这意味着仅您单击的链接
try
$(this).addClass("active");instead of$('.gotoStep1').addClass("active");This means only the link which you clicked
您可以使用插件或这样。
You can use a plugin or this way.