onhashchange 事件不检测 "/Home/Index" 和 "/" 之间的更改 - ASP.NET MVC3

Question

我在ASP.NET MVC3 web应用程序中工作，问题如下：我想使用检测URL更改

window.onhashchange = function (event) { 
    //some stuff...
};

而且效果很好。。。但是，它工作得很好，而在url中总是出现：

'本地主机：[port]/Home/Index'

或者在某些情况下，url更改为：

'本地主机：[port]/Home/Index#'

当用户更改url时（例如，他删除了"/Home/Index"），页面将被重新加载（url为"localhost:[port]/"，但当用户按下后退按钮并再次返回到">/Home/Inindexonhashchange事件"未检测到此更改。为什么？"/Home/Index'和'/'是否相同？

Answer 1

散列是url中#符号之后的散列。

如果当前url为：

http://localhost:12345/Home/Index#chapter-1

如果有人点击了这样一个链接：<a href="#chapter-2">Chapter 2</a>，那么url的哈希部分就会改变，导致window.onhashchange被触发。导航到另一个页面不会触发onhashchange事件，因为哈希在新页面上没有更改。

window.onhashchange = function(e) {
      var log = document.getElementById("log");
      log.innerText = "Event: Hash changed " + location.hash;
      window.setTimeout(function() {
        log.innerText = "Event: ";
      }, 3000);
    }

<div id="log">Event:</div>
<ul>
  <li><a href="#chapter1">Change hash to chapter 1</a></li>
  <li><a href="#chapter2">Change hash to chapter 2</a></li>
  <li><a href="#">Change hash to nothing</a></li>
  <li><a href="#" onclick="location.reload()">reload page</a></li>
</ul>