您如何确定地检测用户是否在浏览器中按下了后退按钮?

如何使用#URL系统在单页web应用程序中强制使用页面内返回按钮?

为什么浏览器的后退按钮不触发它们自己的事件!?


当前回答

if (window.performance && window.performance.navigation.type == window.performance.navigation.TYPE_BACK_FORWARD) {
  alert('hello world');
}

这是唯一一个解决方案,为我工作(这不是一个一页网站)。 它支持Chrome、Firefox和Safari浏览器。

其他回答

 <input style="display:none" id="__pageLoaded" value=""/>


 $(document).ready(function () {
        if ($("#__pageLoaded").val() != 1) {

            $("#__pageLoaded").val(1);


        } else {
            shared.isBackLoad = true;
            $("#__pageLoaded").val(1);  

            // Call any function that handles your back event

        }
    });

上面的代码对我有用。在移动浏览器上,当用户单击后退按钮时,我们希望恢复页面状态与他上次访问时相同。

我通过跟踪触发hashchange的原始事件(无论是滑动、单击还是滚动)来解决这个问题,这样事件就不会被误认为是简单的页面登陆,并在每个事件绑定中使用一个额外的标志。当点击后退按钮时,浏览器不会再次将标志设置为false:

var evt = null,
canGoBackToThePast = true;

$('#next-slide').on('click touch', function(e) {
    evt = e;
    canGobackToThePast = false;
    // your logic (remember to set the 'canGoBackToThePast' flag back to 'true' at the end of it)
}

这将肯定工作(用于检测返回按钮点击)

$(window).on('popstate', function(event) {
 alert("pop");
});

我已经为这个需求挣扎了很长一段时间,并采用了上面的一些解决方案来实现它。然而,我偶然发现,它似乎可以在Chrome、Firefox和Safari浏览器以及Android和iPhone上运行

页面加载:

window.history.pushState({page: 1}, "", "");

window.onpopstate = function(event) {

  // "event" object seems to contain value only when the back button is clicked
  // and if the pop state event fires due to clicks on a button
  // or a link it comes up as "undefined" 

  if(event){
    // Code to handle back button or prevent from navigation
  }
  else{
    // Continue user action through link or button
  }
}

如果有帮助请告诉我。如果我错过了什么,我会很高兴去理解。

if (window.performance && window.performance.navigation.type == window.performance.navigation.TYPE_BACK_FORWARD) {
  alert('hello world');
}

这是唯一一个解决方案,为我工作(这不是一个一页网站)。 它支持Chrome、Firefox和Safari浏览器。