使用jquery禁用浏览器后退操作

时间:2016-10-08 13:28:40

标签: javascript jquery browser

我正在开发一个在线测试应用程序,并且要求在测试期间,不允许用户刷新页面,直到测试结束为止。我已经成功地通过所有可能的方式(据我所知)使用以下代码禁用jquery中的刷新操作:

$(window).bind({
  beforeunload: function(ev) {
    ev.preventDefault();
  },
  unload: function(ev) {
    ev.preventDefault();
  }
});

但是我一直在解决所有浏览器禁用后退操作的问题,我遇到的最佳解决方案与上面的代码冲突,如下所示:

window.onload = function () {
  if (typeof history.pushState === "function") {
      history.pushState("jibberish", null, null);
      //alert("Reloaded");
      window.onpopstate = function () {
          history.pushState('newjibberish', null, null);
          // Handle the back (or forward) buttons here
          // Will NOT handle refresh, use onbeforeunload forthis.
      };
  }
  else {
      var ignoreHashChange = true;
      window.onhashchange = function () {
          if (!ignoreHashChange) {
              ignoreHashChange = true;
              window.location.hash = Math.random();
              // Detect and redirect change here
              // Works in older FF and IE9
              // * it does mess with your hash symbol (anchor?) pound sign
              // delimiter on the end of the URL
          }
          else {
              ignoreHashChange = false;
          }
      };
    }
  }

上面的解决方案适合我禁用后退按钮但与上面的页面刷新防护处理程序冲突的目的。 我不知道该做什么,而且我已经搜索了很长时间才解决这个问题,但还没找到。任何帮助都会非常感激,即使它采用完全不同的方法来解决问题,我也不会介意。 谢谢大家

更新

我从来没有意识到以这种方式做事会破坏很多道德规则,无论如何,我已经考虑过这个问题,并且当页面被刷新或按下后退按钮时(或者使用键盘或浏览器控件)。我想重定向到一个将结束当前考试的网址。我相信这是可能的,因此我认为我寻求的解决方案是获得实现这一目标的最佳方法。如果按下后退按钮或刷新按钮(使用浏览器控件和键盘,则重定向到另一个URL)。

3 个答案:

答案 0 :(得分:3)

我尝试了很多选择,但是除了这个之外没有一个-

//Diable Browser back in all Browsers
if (history.pushState != undefined) {
history.pushState(null, null, location.href);
}
history.back();
history.forward();
window.onpopstate = function () {
history.go(1);
};

答案 1 :(得分:0)

关于我在问题中发布的更新,我已经能够解决我的问题了。这就是我所做的(只是稍微修改我现有的代码并删除我最初的window.onload监听器):

$(window).bind({
  beforeunload: function(ev) {
    window.location.replace("my_url_goes_in_here");
  },
  unload: function(ev) {
    window.location.replace("my_url_goes_in_here");
  }
});

此构造适用于以任何方式完成的页面刷新和后退操作(使用任何键盘或浏览器控件)。

但是,我还没有在firefox 47.0以外的任何其他浏览器中进行测试,但我很高兴它现在都在工作。 感谢您的所有评论,他们非常有帮助

答案 2 :(得分:-1)

如果你有两个页面page1和page2并且(page1重定向到第2页)并且你想限制用户回到page1,那么使用javascript,只需将此代码放在第1页。

 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            function disableBack() {
                window.history.forward()
            }

            window.onload = disableBack();
            window.onpageshow = function (evt) {
                if (evt.persisted)
                    disableBack()
            }
        });
    </script>