锚链接到另一个页面答案

【问题标题】：anchor links to another page锚链接到另一个页面
【发布时间】：2014-08-13 01:57:28
【问题描述】：

我有一个网站，其首页上有锚链接，链接到页面的不同部分。我遇到了辅助页面的问题，每当他们单击引用主页上部分的锚链接时，它不会将它们带到该部分。我曾尝试使用完整的 URL http://www.website.com/index.php#1，但这仅适用于主页，但不会触发锚链接的位置。我有什么遗漏吗？

我正在使用以下 Jquery 进行平滑滚动，并在它们位于某个部分时激活菜单翻转。

<script>
var timerid; //Used to fire scroll function once after scrolling is done.
$(document).ready(function(){
$("#menu-main-menu a").click(function(e){
    e.preventDefault();
    $("#menu-main-menu a").removeClass('active');
    var id = $(this).attr("href").substring(1);
    $("body").animate({
        'scrollTop': $("section#" + id).offset().top -133
    });        
});
$("body").scrollTop(1); //forcing window scroll to execute on page load
$(window).scroll(function(){
    clearTimeout(timerid);
    timerid = setTimeout(checkactivelink, 50);
});

function checkactivelink()
{
    $("section").each(function(){
        if($("body").scrollTop() >= $(this).offset().top -133)
        {
            $("#menu-main-menu a").removeClass('active');
                $("#menu-main-menu a[href=#" + $(this).attr("id") + "]").addClass('active');
        }
    });
}
});
</script>

【问题讨论】：

$("body").scrollTop(1) 覆盖了正常向下滚动到 URL 中的锚点。
那么我会删除这个吗？还是有更好的方法来解决这个问题？
将您的代码绑定到hashchange 事件而不是click，然后将.trigger('hashchange') 绑定到$(document).ready 上
我想我还是做错了什么，因为它仍然无法正常工作。我想要的只是有人点击学生并进入学生页面。然后他们单击顶部链接，他们将返回主页并向下到适当的锚区域。示例链接：gr8students.wpengine.com

标签： jquery html css

【解决方案1】：

尝试替换

$("body").scrollTop(1);

与：

if(location.hash) {
    $("#menu-main-menu a[href='"+location.hash+"']").click();
}

因此，当您打开链接中带有锚点的页面时，它将模拟单击相应的导航菜单。

【讨论】：