防止在刷新页面上多次点击返回导航

Question

我已经使用有效的 window.history.go() 方法转到上一页按钮。

问题：页面重新加载后，我需要多次单击按钮才能转到上一页。

那么如何防止多次点击返回按钮返回第一次点击呢？

用history.pushState() 和window.onpopevent() 方法找到这篇文章：https://www.safaribooksonline.com/library/view/javascript-cookbook/9781449390211/ch20s04.html，这可以解决吗？

以及如何在我的代码中实现？

代码

HTML：

<div id="goToPreviousPage">
   <a href="#"></a>
</div>

JS：

const goBackButton = document.querySelector("#goToPreviousPage");

goBackButton.onclick = function(e) {
   window.history.go(-2);
}

使用window.onbeforeunload 方法返回按钮在重新加载页面后起作用，但在正常状态下不重新加载页面返回按钮无法再导航：

goBackButton.onclick = function(e) {
   window.onbeforeunload = function(event)
      {
        return confirm("Confirm refresh");
      }; 
   window.history.go(-4);
}

有什么建议吗？

Answer 1

我认为问题在于您的 href="#" 在单击时将当前页面添加到历史记录中。尝试将以下内容添加到您的函数中以防止链接的默认行为。

e.preventDefault()