JavaScript 无法直接监听后退按钮，只能通过 popstate 事件监听历史栈变化；该事件在用户点击后退/前进按钮或调用 history.back()/forward() 时触发，且仅当 URL 改变并完成导航才触发，配合 pushState 才能实现 SPA 的可控路由。
JavaScript 无法直接监听“后退按钮”这个物理操作，而是通过监听浏览器历史栈的变化来感知用户是否点了后退（或前进）。核心机制是 popstate 事件，它在用户触发历史导航（如点击后退/前进按钮、调用 history.back() 或 history.forward()）时触发。
监听 popstate 事件
这是最标准、最可靠的方式。注意：仅当历史记录真正切换（即页面 URL 改变并完成导航）时才会触发，pushState 和 replaceState 不会触发它。
- 使用
window.addEventListener('popstate', handler)注册监听器 - 事件对象
event.state包含通过pushState或replaceState传入的状态数据（若有的话） - 示例：
window.addEventListener('popstate', function(event) {
console.log('用户执行了后退或前进操作');
console.log('携带的状态：', event.state);
});
</script>
为什么不能用 click 或 keydown 监听后退按钮？
浏览器不暴露后退按钮的 DOM 元素，也没有对应的键盘快捷键统一事件（如 Alt+← 在不同系统/浏览器行为不一致且不可靠）。试图监听组合键或模拟点击既不兼容也不符合规范，属于无效方案。
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
- 后退按钮是浏览器 UI 控件，不属于网页可访问的 DOM 范围
- 所有基于按键、鼠标坐标、按钮 ID 的“模拟监听”均不可靠，且违反同源策略和安全限制
-
popstate是 W3C 标准定义的唯一合法途径
配合 history.pushState 实现可控导航
单纯监听 popstate 只能“感知”后退，但要让 SPA 正常响应（比如更新视图、恢复表单），必须提前用 pushState 记录状态。
立即学习“Java免费学习笔记（深入）”；
- 每次路由变化前调用
history.pushState({ page: 'detail' }, '', '/detail') - popstate 触发时，根据
event.state或location.pathname执行对应逻辑 - 避免页面刷新，达成真正的单页体验
补充：想阻止后退？用 beforeunload（有限制）
如果目标是“用户点后退时弹确认框”，可用 beforeunload，但它不是专为后退设计，会在关闭标签页、跳转到外部链接等所有卸载场景触发。
- 需在事件处理函数中返回非空字符串（现代浏览器只显示统一提示语）
- 不能自定义文案，也不能阻止默认行为（仅能提示）
- 代码示例：
window.addEventListener('beforeunload', () => '请保存您的输入');
