在window.onPopState中是否可能使用e.preventDefault？

Question

我试图阻止用户在我的Web应用中返回。为此，我尝试捕获window.onpopstate事件并添加e.preventDefault来取消返回按钮的效果。但看起来没有生效。

window.addEventListener('popstate',function(e){ 
console.log(e); e.preventDefault();  
});

阻止浏览器的popstate事件是不可能的吗？或者是我的做法有问题吗？

- Ivin

Answer 1

根据这份文档，popstate事件不可取消：

规范: HTML5
接口: PopStateEvent
冒泡: 是的
可取消性: 否
目标: defaultView
默认行为: 无

- Patrick Klug

---

不过你可以这样做： window.onpopstate = function (ev) { ev.preventDefault(); history.go(1); }; - Sean

Answer 2

首先，"不可能"从来都不是一个可接受的答案。 其次，您可以弥补popstate错误。例如，我的富文本编辑器必须不断弥补懒惰的退格键：Backspace的影响。它不是一个有效的后退按钮（就像空格键是“向下滚动页面”），但人们往往会把他们的个人喜好强加于世界，而不是添加浏览器扩展，因此，当人们按下它时，有时候会触发popstate而不是编辑器删除键盘插入符号左侧的任何字符。

以下代码（在 平台文档 中详细说明了依赖项）检测popstate错误何时被触发，用 e.preventDefault(); 阻止它，然后使用 history.go(1); 修复地址栏地址。使用编辑器的人没有注意到发生了什么，因为浏览器不允许操作DOM。这段代码非常简洁（其他人也许在各种上下文中弥补这个错误），目前我只在Gecko/Firefox中测试过，因此请确保在基于Blink、Presto、Trident和WebKit的浏览器中进行测试。

window.onpopstate = function(e)
{
 if (id_('editor') && is_node_parent(document.activeElement,id_('editor')))
 {
  e.preventDefault();
  history.go(1);
 }
}

- John

---

“不可能” 绝对可以作为一个答案。 - Rob

我在Chrome上报告了一个关于退格键的错误，并强烈指出数据丢失的高风险。你知道吗？他们听取了我的建议并将退格键作为后退按钮从Chrome中移除。经过这么多年，只需要提出要求就行了。现在如果YouTube也能听一下关于空格键的建议就好了…… - Zectbumo

相关：调用 e.stopImmediatePropagation() 可以防止后续添加的 popstate 处理程序触发。例如，如果路由器侦听 popstate 并相应地替换内容，则可以防止其替换内容。 - JohnnyFun

你坚持重新添加的文本不合适，请停止回滚。 - Zoe stands with Ukraine