禁用浏览器上的"后退"按钮

Hao*_*est 31 browser back-button

我正在编写一个应用程序,如果用户回击,它可能会重新发送相同的信息并弄乱数据的流和完整性.如何为有和没有javascript的用户禁用它?

Sco*_*man 76

遗憾的是,这是不可能的.但是,请考虑您的应用程序导航模型 您使用的是Post/Redirect/Get PRG Model吗?http://en.wikipedia.org/wiki/Post/Redirect/Get

此模型比Postback模型更具有后退按钮友好性.

  • 没什么可悲的. (51认同)
  • 有效点.我很伤心.;) (19认同)

blo*_*art 12

你不应该.

您可以将一些脚本附加到页面的onbeforeunload事件,并与用户确认他们想要做什么; 你可以去一点,并试图禁用它当然,这只会对谁启用JavaScript的用户的工作,但.而是考虑重写应用程序,这样您就不会在每个页面提交时提交事务,而只是在流程结束时提交.


Mik*_*ffe 8

我强烈建议你去英雄,以防止打破后退按钮,它是疏远你的用户的一种确定的火力方式,甚至在1999Jacob Neilsen的十大网页设计错误中成为第一.

也许您可以考虑提出这样的问题:"如何避免打破<在此处插入您的场景>的后退按钮?"

如果斯科特的回答接近标记,请考虑将您的流程更改为PRG模型.如果它是其他的东西,那么请提供更多细节,看看我们如何提供帮助.

  • 他没有说他想"打破"后退按钮.他希望避免现代Ajax设计模式失败的常见陷阱,因为用户按下"返回"意味着"撤消我刚刚使用您的Ajax应用程序执行的操作",而是获得"返回一个任意且不明确的HTTP请求". (2认同)
  • 对我来说,这只是“他不想破坏后退按钮,他只是想破坏后退按钮以防止其被破坏”。:S 可以让 AJAX/JavaScript 和后退按钮发挥出色,我所建议的就是我推荐遵循的路线。 (2认同)

Yos*_*sho 7

我想出了一个使用JavaScript禁用后退按钮的小黑客.我在chrome 10,firefox 3.6和IE9上检查了它:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<title>Untitled Page</title>
<script type = "text/javascript" >
function changeHashOnLoad() {
     window.location.href += "#";
     setTimeout("changeHashAgain()", "50"); 
}

function changeHashAgain() {
  window.location.href += "1";
}

var storedHash = window.location.hash;
window.setInterval(function () {
    if (window.location.hash != storedHash) {
         window.location.hash = storedHash;
    }
}, 50);


</script>
</head>
<body onload="changeHashOnLoad(); ">
Try to hit back!
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

  • 它对用户来说并不总是一种糟糕的体验,有时候也是正确的体验.例如,页面可能会使用Ajax更改其状态,例如gmail.当用户点击"返回"时,用户实际上希望页面返回到先前的*状态*,而不是返回到前一个*页面* (5认同)
  • 但它有效 - 继续测试它. (3认同)
  • IE9不允许我向下滚动这个.适用于最新的FF,Chrome,Safari.将使用我的单页应用程序的人只能使用IE <= 9. (3认同)

Cla*_*sen 5

最好的选择是不依靠回发来控制流量,但如果你坚持使用它(现在)

你可以使用这样的东西:

  Response.Cache.SetCacheability(HttpCacheability.NoCache);
  Response.Cache.SetExpires(Now.AddSeconds(-1));
  Response.Cache.SetNoStore();
  Response.AppendHeader("Pragma", "no-cache");
Run Code Online (Sandbox Code Playgroud)

很快你会发现它不能在所有浏览器上运行,但是你可以在代码中引入一个检查,如:

 if (Page.IsPostBack)
 {
        if (pageIsExpired()){
           Response.Redirect("/Some_error_page.htm");
        }
        else {
           var now = Now;
           Session("TimeStamp") = now.ToString();
           ViewState("TimeStamp") = now.ToString();
        }

  private boolean pageIsExpired()
  {
     if (Session("TimeStamp") == null || ViewState("TimeStamp") == null)
        return false;

     if (Session("TimeStamp") == ViewState("TimeStamp"))
        return true;

        return false;
  }
Run Code Online (Sandbox Code Playgroud)

这将在一定程度上解决问题,代码未经检查 - 仅用于示例目的..