jQuery：显示隐藏部分并导航到锚点答案

【问题标题】：jQuery: Show hidden section and navigate to anchorjQuery：显示隐藏部分并导航到锚点
【发布时间】：2012-02-21 13:50:07
【问题描述】：

我创建了一个页面，其中包含一组 section 元素，这些元素与特定的 ids 相关联。该页面还有一个指向每个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。我无法想象这会很难，我只是不知道怎么做。

【问题讨论】：

标签： javascript jquery anchor href

【解决方案1】：

只需删除

return false;

在您的 onclick 回调中。这将允许浏览器执行将页面导航到具有匹配 id 的元素的默认功能。

【讨论】：

【解决方案2】：

尝试$(this).addClass("active"); 而不是$('.gotoStep1').addClass("active"); 这意味着只有您点击的链接

【讨论】：

【解决方案3】：

您可以使用plugin 或this 方式。

【讨论】：