检测或捕获 hashbang/querystring 更改为相同的 href 目标

Question

我注意到一些网站，如果我创建多个共享相同目标的 link，该网站实际上不会重新加载请求，而是捕获 link 并处理它，要么通过将其加载到其应用程序中的选项卡中，要么再次更改页面中的元素......所有这些都无需完全重新加载 URL 请求。

如何在我的页面中检测到此内容？

例如，我想像这样处理来自外部 link 的多个 link

<a href="http://192.168.1.10/index.php?p=1#/tag/ABC-0021" target="myapp">0021</a>           
<a href="http://192.168.1.10/index.php?p=1#/tag/ABC-0031" target="myapp">0031</a>
<a href="http://192.168.1.10/index.php?p=1#/tag/ABC-0012" target="myapp">0012</a>

现在，每次我单击其中一个 link 时，我的整个 app/page 都会在该目标的浏览器选项卡中刷新。任何人都知道防止这种情况发生的方法，以便我可以适当地处理它吗？

编辑：Google 音乐执行此操作 - 尝试单击 link，打开一个选项卡后，将该选项卡移动到屏幕的另一个 monitor/area。 Select 另一个 link，请注意 Google 音乐的内容发生了变化，但并未完全刷新整个应用程序。 https://jsfiddle.net/jonemzke/

Edit2：我想它与 window.onbeforeunload 或 popstate 更改有关，但是我找不到该场景的具体代码示例。

Answer 1

window.onhashchange

    window.onhashchange = function() {
        document.getElementById("hash").innerText =  window.location.hash;
    };

<a href = "#no_refresh">No Refresh</a>
<a href = "#still_no_refresh">Still no Refresh</a>
<br />
Current hash<div id = "hash"></div>

https://developer.mozilla.org/en/docs/Web/API/WindowEventHandlers/onhashchange

Answer 2

谢谢大家 - 就我而言，这是因为我实际上链接到本地不安全的 HTTPS 服务器，我没有有效的 SSL。我只是用它来测试（并绕过安全警告），但是浏览器认为这是每次都需要重新加载的东西。如果您使用哈希传递到非 HTTPS 或真正的 HTTPS 站点，它不会像我想要的那样刷新！

检测或捕获 hashbang/querystring 更改为相同的 href 目标

Detect or capture hashbang/querystring change into same href target

html

javascript

hashbang