阻止浏览器后退按钮默认操作

最新推荐文章于 2024-06-23 04:15:59 发布

原创最新推荐文章于 2024-06-23 04:15:59 发布 · 2.2k 阅读

6 ·

CC 4.0 BY-SA版权

javascript 专栏收录该内容

50 篇文章

订阅专栏

本文介绍了一种方法来阻止浏览器的后退按钮默认行为，并允许开发者定义点击后退时的操作。通过监听popstate事件并取消历史记录更改，可以有效地控制浏览器导航。


/**
 * 阻止浏览器后退按钮默认操作
 * @param onBackClick 点击回退时的操作
 */
export function preventBack(onBackClick) {
  function handleGoBack() {
    // history.pushState(null, null, location.href)
    onBackClick()
    window.removeEventListener('popstate', handleGoBack)
  }

  history.pushState(null, null, location.href)
  window.addEventListener('popstate', handleGoBack)
}