时间戳

首页 > 解决方案 > 为什么在 location.hash 上不自动输出刷新？

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

问题描述

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

我不明白为什么浏览器不输出更新的变量。

<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 值？

标签： javascripthashlocation

解决方案

我建议您创建一个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>

推荐阅读