Question

假设我们有一个简单的html页面，其中包含一个脚本：

<html> 
<script type="text/javascript"> 
window.onpopstate=function(event) 
{   alert("hi"); } 
</script> 
<body > 
<h1> Hi, 2 </h1> 
<a href="h3.htm">next</a> 
</body> 
</html>

它不起作用（我在Chrome和FF下尝试过）。但是当我编写脚本代码为

时

<script type="text/javascript"> 
function pp(event) {      alert("hi");    }
window.onpopstate=pp()
</script>

它有效！至于我，这两段代码只在函数定义上有所不同，但实际上它们并不相同。

BTW，即使 onpopstate 事件触发，事件也是未定义的。这对我来说还是一件不为人知的事情。谢谢你的帮助。

Answer 1

正如@Sampson所说......他们不一样......

在第二个示例中，window.onpopstate正在填充pp执行的结果。在这种情况下，此函数返回undefined，因此在此之后未定义window.onpopstate。当然，您会看到alert，但window.onpopstate是undefined。

在第一个例子中，window.onpopstate填充了函数本身，这是实际预期的。如果您看到the docs，则onpopstate需要funcRef，这正是您作为参数传递的内容。

底线：在第二个示例中，您看到alert，因为您正在调用该函数，但第一个是正确的函数。为了真正看到onpopstate被解雇，您应该添加到浏览器历史记录中，但这是另一个故事......

Answer 2

首先在第二个代码段中，您有函数调用pp()，并且您可能会window.onpopstate=pp。

其次，当您手动执行history.pushState({page: 1}, "title 1", "?page=1");然后history.back();或只需单击后退按钮时，它就会起作用。不知道为什么点击链接不会在历史记录中添加条目。

2个事件处理程序分配之间的差异

2 个答案: