在IE10和IE11中未触发hashchange事件，具有history.pushState和url手动操作的组合

Question

我在IE10和IE11中无法一致触发hashchange事件

如果我使用历史记录。pushState来改变当前的哈希值，然后在url中操作哈希值，那么hashchange将触发一次。

如果以上重复，则不会触发hashchange

我创建了一个jsbin来测试这个问题。要在IE10/IE11中重复这个问题，只需点击一个章节链接(例如第4节)，然后在url中操作章节id(例如第3节)。应该触发hashchange，但如果重复，第二次就不会触发。

http://jsbin.com/locor/5

BTW -这在Chrome和Firefox中工作完美

Answer 1

下面有一个副本。似乎如果您使用pushState更改哈希值，IE在检查hashchange事件时忽略该更改。如果你的哈希序列是:

1. #
2. #foo(通过pushstate添加)
3. #(手动添加到地址栏)

IE将#3与#1而不是#2进行比较。由于#1 === #3,IE不会触发hashchange事件。

<script>
function log(message) {
    var div = document.getElementById("log");
    div.innerHTML += message + "<br>";
}
window.addEventListener("hashchange", function () {
    log("hashchange");
});
window.addEventListener("popstate", function(){
    log("popstate");
});
</script>
<p>1. Manually set the hash in the address bar to "#".</p>
<p><a onclick='history.pushState({}, "", "#somePushState");' style="color:blue;">2. Click here to run push state.</a></p>
<p>3. Manually set the hash in the address bar to "#".</p>
<br>
<p>Expected: browser fires hashchange event for #1 and #3. Actual: IE does not fire hashchange event for #3.</p>
<div id="log"><b>Log:</b><br></div>