当 hashchange 发生时 IE 不触发 popstate答案

【问题标题】：IE not firing popstate when hashchange happens当 hashchange 发生时 IE 不触发 popstate
【发布时间】：2014-06-18 20:55:57
【问题描述】：

我的页面正在客户端进行路由，使用历史 API 和推送/弹出状态。在所有现代浏览器上都可以正常工作。（node.js prerenderer 将支持搜索引擎）

但是，我最近遇到了一个问题，即 IE 不会在 hashchange 上触发 popstate，而带有 urls 的 pushstate 工作得很好，包括 IE11。

例如，像这样……

$(document).on('click', 'a', function(e) {
    e.preventDefault();
    History.pushState({}, '', $(this).attr('href'));
});

...正确触发...

$(window).on('popstate', function() {
    console.log('url changed');
});

根据 W3C 规范，hashchange 应该在改变当前历史记录时触发 popstate。但是，当我添加哈希链接 (<a href="#hashchange">...) 时，在 IE 上单击它，没有任何反应。：/

我不想进行 IE 检测（因为现在有很多浏览器可能会落入同一个厄运深渊），而不是使用特征检测。但是，由于历史记录（popstate/pushstate）在剩下的路上工作得很好，我什至无法检测到缺少 push/popstate 的问题......

if(!window.history || !window.history.pushState) { ...

... 并改用 hashchange。：/

有什么想法吗？

PS。作为奖励，使用带有主题标签 url 的 jquery.history.js（jquery 包装的 history.js 版本）会炸毁整个事情。

http://localhost/routetest/index.html#/page1/1234

变成

http://localhost/page1/1234

... ??? ：/

【问题讨论】：

你在看什么版本的IE？对于 IE 9，pushState() 似乎存在问题。请查看此问题并提供答案：stackoverflow.com/questions/3722815/…
啊，对不起。 IE11。刚刚提到现代浏览器，但在 IE 版本上失败了:)

标签： javascript jquery pushstate history.js

【解决方案1】：

这是 IE11 和 Edge 之前的所有 Internet Explorer 浏览器中的一个已知问题。

查看此链接https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3740423/。 Microsoft 的回复是此问题报告中的最后一篇文章，并指出了正在运行的最新版本。

所有版本的 IE 都会显示此行为，并且将正确的行为破解/猴子修补到事件框架中可能是使其可靠工作的唯一方法。这意味着如果您想自己实现它，您可能需要特定于 IE 的逻辑。

【讨论】：

【解决方案2】：

尝试为 History API 使用 polyfill 以获得更好的支持https://github.com/browserstate/history.js

【讨论】：

我不明白反对意见。它解决了 op 的问题。

【解决方案3】：

在 IE 10 和 11 中，只有在使用 history.pushState 或 replaceState 设置状态后，才会为历史项触发 popstate 事件，包括当它设置为 null 时，并且只有在两个具有状态集。因此，需要在 hashchange 事件中为新的历史项设置状态。一旦设置了状态，popstate 事件将在用户浏览浏览器历史记录时触发。

https://developer.mozilla.org/en-US/docs/Web/API/History

【讨论】：