Question

单击链接时不会输出新的位置哈希。

我很困惑，为什么浏览器不输出更新的变量。

<html>
<body>
<p></p>
<a href="#2019-01">1</a>
<a href="#2019-02">2</a>
</body>
<script>
var p = document.querySelector('p');
p.innerHTML = location.hash; 
</script>
</html>

当我单击第一个链接时，浏览器中的地址将更改为＃2019-01，但p.innerHTML不显示任何内容。我希望它显示＃2019-01。

如果我按crtl r重新加载页面，则p.innerHTML显示＃2019-01。

为什么必须强制重新加载才能获得输出？有没有一种方法可以在不重新加载页面的情况下获取更新的location.hash值？

Answer 1

我建议您创建一个showHash函数，然后在页面加载时立即调用它。此外，您可以将事件监听器添加到window.onhashchange，以便在哈希值发生更改时随时调用showHash函数。

showHash();

function showHash() {
  var p = document.querySelector('p');
  p.innerHTML = location.hash;
}

window.onhashchange = showHash;

<html>
  <body>
  <p></p>
  <a href="#2019-01">1</a>
  <a href="#2019-02">2</a>
  </body>
</html>

为什么输出不会在location.hash上自动刷新？

1 个答案: