使用JS / Ajax动态获取带有锚点的URL

时间:2017-09-21 08:43:37

标签: javascript jquery ajax anchor window.location

我有一个基于主播的网站。

对于前。默认网址为domain.com

本网站的另一部分包含网址domain.com/#section1

另一个部分的网址为domain.com/#section2

当我尝试获取网站的完整网址时,我使用了

  

window.location.href

但是当我向下滚动页面并将网址更改为domain.com/#section1时,window.location.href我的$anchor = window.location.hash; if($anchor == "#kraftwerk-82"){ $(".starting-logo.default-logo").attr("src","/logo_main.png"); $(".starting-logo.default-logo").attr("srcset","/logo_main.png 1x, /retina_logo.png 2x"); }else{ $(".starting-logo.default-logo").attr("src","/logo_main_white.png"); $(".starting-logo.default-logo").attr("srcset","/logo_main_white.png 1x, /retina_logo_white.png 2x"); } 没有更改。

我的JS:

{{1}}

如何使用JS动态获取带有正确锚点的URL?

1 个答案:

答案 0 :(得分:1)

您可以使用window.location.hash仅获取哈希标记:

yourHash = window.location.hash.substring(1)

<强>更新

if(window.location.hash){
    console.log(window.location.href + window.location.hash);
}else{
    console.log(window.location.href);
}

更新II

滚动时需要更改哈希值。例如:

var anchor_top = $('a[href="#kraftwerk-82"]').offset().top;

$(window).on('scroll', function() {
    if ( $(window).scrollTop() > anchor_top ) {
        window.location.hash = '#kraftwerk-82';
    }
});

在调用的函数上,您可以检查现在的哈希值是什么:

Function track(){
    $anchor = window.location.hash;
    if($anchor == "#kraftwerk-82"){
        $(".starting-logo.default-logo").attr("src","/logo_main.png");
        $(".starting-logo.default-logo").attr("srcset","/logo_main.png 1x, /retina_logo.png 2x");
    }else{
        $(".starting-logo.default-logo").attr("src","/logo_main_white.png");
        $(".starting-logo.default-logo").attr("srcset","/logo_main_white.png 1x, /retina_logo_white.png 2x");
    }
}