javascript - 在 # 符号后检测 url 更改

Question

我正在使用这段代码来了解 # 符号后 url 中的内容:

var a = document.URL.split("#")[1];

例如，如果页面的url是http://example.com/path/to/somewhere/#contentpart , 变量 a将包含 contentpart .

但问题是，用户可能会单击指向同一页面但指向另一部分的链接(例如:<a href="#footer">Go to footer</a>)，如果是这样，页面将不会重新加载。 (只是页面将被导航到其他地方)

我的问题是，如何检测同一页面上 # 登录后 URL 何时更改？

欢迎使用任何 javascript/jQuery 方法。

Answer 1

我建议，请记住您当前的代码:

$(window).on('hashchange', function(e){
    var newHash = document.href.split('#')[1];
});

虽然简单使用起来更容易一些:

$(window).on('hashchange', function(e){
    var newHash = document.location.hash;
    console.log(newHash);
});

JS Fiddle demo .

如果您不希望散列包含 # 字符，请改用:

$(window).on('hashchange', function(e){
    var newHash = document.location.hash.substring(1);
    console.log(newHash);
});

JS Fiddle demo .