在 IE9 中使用 history.pushstate答案

【问题标题】：Using history.pushstate in IE9在 IE9 中使用 history.pushstate
【发布时间】：2012-12-29 20:34:19
【问题描述】：

由于 window.history.pushState 不适用于 IE9 等 HTML 4 浏览器，因此我寻找了 history.js，这是一个模拟 pushState 行为的 jQuery 库。

问题是，使用pushState时，url的结尾重复了

例如，

History.pushState(null,null,window.location.pathname + '?page=1');

返回，

http://www.development.com/test.html#test.html?page=1

如何避免这个问题？非常感谢。

更新（2012 年 1 月 22 日），悬赏问题：

                if (pageNo == 1){
                    //window.history.pushState({"html":currURL,"pageTitle":''},"", window.location.pathname + '?page=1'); For chrome and FX only
                    //History.replaceState(null,null,'')
                    //History.pushState(null,null,'?issue=' + currPageIssueNo + '&page=1');
                }   
                else if (pageNo != 1 || pageNo == 1 && linkPageNo > 1  ) {
                    History.pushState(null,null,'?issue=' + currPageIssueNo + '&page=' + pageNo);
                    //window.history.pushState({"html":currURL,"pageTitle":''},"", newURL);   For chrome and FX only
                }

我还是遇到这个问题，如果是第一页

http://localhost/development/flipV5.html?issue=20121220&page=1

当我在 IE9 中转到第二页时，它有 url：

http://localhost/development/flipV5.html?issue=20121220&page=1#flipV5.html?issue=20121220&page=2

我想要实现的是

http://localhost/development/flipV5.html?issue=20121220&page=2

如果HTML 4浏览器不可能，请至少实现

http://localhost/development/flipV5.html/#?issue=20121220&page=2

感谢您的帮助

【问题讨论】：

'test.html' 理想情况下应该是development.com/test.htm;?page=1 是完美的，但似乎不可能
这是演示balupton.github.com/history.js/demo/?state=4
试试balupton.github.com/history.js/demo/#?state=4
由于IE9不支持pushState，所以使用onhashchange模拟。这意味着它（可能）应该将#test.html 添加到 URL。
谢谢，你介意看看更新的问题吗？

标签： javascript jquery html internet-explorer-9 pushstate

【解决方案1】：

只需从History.pushState 中删除 window.location.pathname

History.pushState(null,null,'?page=1');

【讨论】：

看起来这是在客户端使用history.js api

【解决方案2】：

您的代码完全符合您的预期。

window.location.pathname + '?page=1'

打印出位置路径名 (test.html)，并附加 ?page=1

删除window.location.pathname，它应该可以工作。

【讨论】：

【解决方案3】：

不妨试试：

History.replaceState(null,null,'?issue=' + currPageIssueNo + '&page=' + pageNo);

【讨论】：

看起来这是在客户端使用history.js api

【解决方案4】：

您需要为 IE 设置客户端重定向。假设用户登陆此页面：

http://localhost/development/flipV5.html?issue=20121220&page=1

他们需要发送到

http://localhost/development/flipV5.html#?issue=20121220&page=1

原因是 IE spambook.com 时，这是一项旧的安全功能，可防止将URL 更改为facebook.com。最近，人们意识到这太过分了。

重定向看起来像这样：

<!--[if LTE IE 9]>
<script type="text/javascript">
if (location.search) 
    location.href = location.pathname + "#" + location.search;
</script>
<![endif]-->

您现在可以推送状态，它们不会同时出现在搜索和哈希中（分别在 ? 和 # 之后）

【讨论】：