/ pushState bug？
首先，我不完全确定我在做什么或期待什么是正确的。这方面的文档似乎不多，但我所读到的资料表明，这应该是可行的。
我在尝试使用history.pushState时遇到了一些问题，所以我最后制作了一个演示页面来查看出了什么问题。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" ></script>
<script>
window.onpopstate = function()
{
var d = new Date;
console.log(d.toString());
console.log(document.location.href);
};
$(document).ready(function()
{
$('#push').click(function()
{
var rand = Math.random();
history.pushState( {'number':rand} , 'Test '+rand , '/test/'+rand );
return false;
});
});
</script>
</head>
<body>
<a href="#" id="push">New state</a>
</body>
</html>当我单击‘onpopstate’链接时，我希望在控制台中看到onpopstate函数已被触发，并将看到一个新的url (类似test/number)。
chrome中地址栏中的位置确实会更新，但是onpopstate事件不会触发。然后，当我单击浏览器中的“后退”按钮时，似乎会触发多个popstate事件。看来，每当我使用浏览器导航按钮时，本应触发的每个popstate事件都会同时发生。
这有点难以解释。这是我希望在控制台上看到的。
加载页面。Chrome在页面加载popstate.html:13Sat上启动初始流行状态事件，2011年11月19日16:23:48 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/popstate.html 单击“新状态”链接。地址栏中的位置将更新为http://example.com/test/0.06458491436205804。2011年11月19日星期六16:23:53 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/test/0.06458491436205804 单击浏览器中的“后退”按钮。地址栏中的url返回到/popstate.html popstate.html:13Sat，2011年11月19日16:26:27 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/popstate.html
这正是我所期待的。我看到的是..。
加载页面popstate.html:13Sat 2011年11月19日16:27:42 GMT+0000 (格林尼治标准时间) popstate.html:14http://example.com/popstate.html 单击新的状态链接。控制台中没有显示任何内容。地址栏更改为/test/0.5458911096211523 单击浏览器中的“后退”按钮。地址更改回/popstate.html popstate.html:13Sat 2011年11月19日16:27:42 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/popstate.html popstate.html:13Sat 2011年11月19日16:28:57 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/popstate.html
正如您所看到的，它重复初始的流行状态并显示返回到/popstate.html，但是它从不为被推送的sate触发。如果我现在在浏览器中向前按下，我会得到：
popstate.html:13Sat 2011年11月19日16:27:42 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/popstate.html popstate.html:13Sat 2011年11月19日16:28:57 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/popstate.html popstate.html:13Sat 2011年11月19日16:29:58 GMT+0000 (格林尼治时间标准时间) popstate.html:14http://example.com/test/0.5458911096211523
(它们都再次出现，下面是截图：http://img.ctrlv.in/4ec7da04e20d3.jpg)
我不知道我是不是做错了，我的期望是错误的，还是这实际上是一个错误？
提前感谢所有读过这篇文章的人，他们能为我提供一些线索。
回答 1
Stack Overflow用户
发布于 2011-11-19 16:55:58
Chrome的console.log不能很好地处理其他页面上的事情。您可以确认这一点，因为它一次用其他时间戳记录几件事情(这是不可能的)。您最好使用$("body").append在这里登录(或者附加到其他元素中)。
其次，当您推送状态时，显然不会弹出状态，因此不会触发popstate事件。如果您也想在推送状态时触发onpopstate处理程序，您可以创建一个简单的包装器，如：http://jsfiddle.net/vsb23/2/。
function load(url, state) { // logging function; normally load AJAX stuff here
$("pre").append(new Date
+ "\n" + url
+ "\n" + JSON.stringify(state) // to log object as string
+ "\n\n");
}
function pushState(data, title, url) {
history.pushState(data, title, url);
load(location.href, data); // call load function when pushing as well
}
window.onpopstate = function(e) {
load(location.href, e.state);
};
$("button").click(function() {
pushState({foo: "bar"}, "test", "/test?a=b"); // sample push
});编辑：，这已经是铬虫追踪器上的一个bug了。
https://stackoverflow.com/questions/8195502
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号