hashchange事件不触发因location.hash赋值无效，仅用户交互或history API变更URL时触发；需用pushState+监听、初始化读hash、避免混用模式，并在框架中显式调用路由更新。
hashchange 事件监听不到跳转？检查是否用了 location.hash 赋值
直接改 location.hash 不触发 hashchange 是常见误解。浏览器只在用户点击链接、前进/后退、或调用 history.pushState()/history.replaceState()（且 URL 实际变化）时发事件；但 location.hash = 'xxx' 在某些旧版 Safari 或 iframe 场景下可能静默失败，或不触发事件。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 优先用
history.pushState()+ 监听hashchange，而不是仅靠赋值location.hash - 手动触发前先比对当前
location.hash和目标值，避免无意义赋值（不会触发事件，还可能引发重复渲染） - 在页面初始化时主动读取一次
location.hash，因为首次加载不会触发hashchange
单页应用中 hashchange 处理路由，为什么 history.state 总是 null？
hashchange 事件本身不携带 state，它只反映 URL 片段变化。如果你依赖 event.state，说明你混淆了 hashchange 和 popstate——后者才带 state，但只响应 pushState/replaceState，不响应纯 hash 变更。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 纯 hash 导航场景下，不要指望
event.state，老实用location.hash解析路由 - 如果需要状态透传（比如滚动位置、临时参数），得自己存到
sessionStorage或闭包变量里，和 hash 同步更新 - 混用
pushState和 hash 会破坏一致性，选一种模式到底：要么全 hash（兼容性好），要么全 history API（需服务端 fallback）
IE9 支持 hashchange，但监听失效？确认是否漏了 document.readyState
IE9 确实支持 hashchange，但它要求事件监听器必须在 document 完全加载后注册，否则绑定无效。很多脚本放在 里直接执行，此时 document 还没 ready，addEventListener('hashchange', ...) 就白绑了。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 把监听代码包在
DOMContentLoaded或window.onload里（IE9 支持前者） - 或者用兼容写法：
if ('onhashchange' in window) { window.addEventListener('hashchange', handler); }，避免在不支持的环境报错 - 测试时别只点链接——手动在地址栏改 hash 再回车，这是最可靠的触发方式
Vue/React 项目里手动监听 hashchange，为什么路由切换后组件没更新？
框架的响应式系统不知道你手动改了 location.hash，也不会自动 re-render。你监听了事件，但没通知框架“路由变了”，数据和视图就脱节了。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 在
hashchange回调里显式调用框架的更新机制：Vue 用this.$router.push()或router.push()；React 用useNavigate()或history.push()（注意不是原生history） - 不要绕过路由库直接操作 DOM 或
location，否则等于放弃框架的生命周期和状态管理 - 如果非要用原生监听（比如集成遗留代码），确保回调里触发的是框架认可的路由变更，而不是
location.hash = 'xxx'
