如果按下后退按钮，如何让用户保持在同一页面上？ [复制]答案

【问题标题】：How to keep user in the same page if the back button has been pressed? [duplicate]如果按下后退按钮，如何让用户保持在同一页面上？ [复制]
【发布时间】：2012-07-25 12:18:03
【问题描述】：

可能重复：
How to disable Back button in IE and firefox?

我正在开发一个单页网站 (DAM)。要进入此站点，用户必须经过身份验证。登录后，如果用户单击后退按钮，他将看到登录页面。登录页面不在我的控制范围内，意味着它是由oracle内容管理系统提供的，所以我不能在那里添加任何代码。

我应该在我的页面中添加什么代码，这样如果按下后退按钮，他将被导航到同一页面。

我尝试使用 onbeforeunload 并且效果很好，但我不想要任何确认消息，只想留在那个页面上。

【问题讨论】：

@RosdiKasim 你读过标题了吗？
覆盖浏览器控件不是一个好主意。充其量你可以向用户发出他们即将离开网站的信号，并让他们选择留下。
没有简单的代码。如果您可以使用 location.replace 那么这是最好的解决方案
这个概念不断出现。人们似乎对覆盖浏览器控件有什么激情？
@RosdiKasim：是的，我同意 RobW：您显然甚至没有正确阅读标题。这与禁用后退按钮功能无关。 没什么。

标签： javascript jquery html back-button

【解决方案1】：

这是不可能的，因为它被明确设计为以这种方式工作 - 如果用户点击“返回”，浏览器必须返回到前一页。有一些不可靠的技术，但最终由于某种原因它们都失败了。

但是...我想在您的情况下，您可以执行双重重定向并在登录后立即处理登录页面中的“后退”按钮？

【讨论】：

+1 曾经访问过一个页面，该页面被重定向到一个拼命阻止您离开的广告？ “等等！如果你留下来，我们会给你......”任何试图阻止我导航的页面都同样令人沮丧，无论意图如何。

【解决方案2】：

具有良好可用性的单页应用如何工作

如果您想增加页面的用户体验和可用性因素，您应该使用页面哈希/片段。我不会提供与其他人相同（或相似）的代码，而是升级体验。

那么那个 UX 怎么样

您的单页 Web 应用程序每次更改其工作上下文时都应该更改哈希值。这可能由用户在 UI 中执行的用户界面或业务流程定义，或者甚至可能是此类流程的各个步骤（当预期用户将/应该返回到先前的流程状态时）。

这样，您的应用程序的功能类似于由多个页面组成的普通 Web 应用程序，并在相同的业务流程及其步骤（在这种情况下的步骤通常是整页回发）的基础上创建新的历史记录条目。

因此，当您可以更改页面片段时，业务流程和将您的应用程序视为普通的多页面应用程序将为您提供许多有用的点。由于您可以控制这一点，因此您可以提供比多页 Web 应用程序更好的粒度（通常更小）。

多页应用历史点数过多的简单例子

表单帖子通常总是有问题，因此在回发响应后有一个历史记录点总是不好的，因为用户按 F5 会一遍又一遍地重新发送相同的表单（好的浏览器确实会询问您是否重新发送帖子数据，但这仍然是糟糕的体验）。

页面碎片是要走的路，只是进一步使用它而不是阻止返回登录页面。

完全防止登录页面进入历史堆栈将通过在iframe 内的页面上显示它。您当然需要检测未经身份验证的用户并自己添加iframe 并在其中加载登录。用户验证后，您应该重新加载您自己的页面。但您应该知道，检测登录成功并不是一个简单的过程。

【讨论】：

【解决方案3】：

window.location.replace(URL);

将当前文档替换为提供的 URL 中的文档。与 assign() 方法的不同之处在于，在使用 replace() 后，当前页面不会保存在会话历史记录中，这意味着用户将无法使用 Back 按钮导航到该页面。

【讨论】：

我应该从哪里调用它？
对不起，我没有注意到登录页面在 OCM 上。在这种情况下，更简单的方法是在登录后在页面中调用 window.open() 以显示您的应用程序并关闭登录页面。

【解决方案4】：

function win_onkeydown_handler()
{
switch (event.keyCode){

case 116 : // 'F5'
event.returnValue = false;
event.keyCode = 0;
alert("Refresh Not Allowed");
break;
case 08 : // 'BS'
if(event.srcElement.tagName=="INPUT" || event.srcElement.tagName=="DIV")
{
}
else{
event.returnValue = false;
event.keyCode = 0;
//alert("Backspace Not Allowed");
}
break;
case 17 : // ctrl key   
 event.returnValue = false;
 event.keyCode = 0;
 alert('Control Key restricted');
 }
 }

即使我在我的项目中得到了这个，但我曾经使用上面的脚本在那个页面上阻止它......如果你需要阻止后退空间，你可以单独使用该代码

【讨论】：

【解决方案5】：

您无权控制客户端浏览器.. 由于一些安全问题，不允许脚本控制客户端浏览器..

【讨论】：

这是一个无用的答案。您甚至没有提供参数为什么“不允许控制客户端浏览器”。
由于一些安全问题，不允许脚本控制客户端浏览器..
由于安全问题，不允许 AntGuider 提供更深入的答案。这就是当今行业的运作方式......不是。

【解决方案6】：

试试这个，它会解决你的问题：

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="button" value="Back" onclick="history.go(0);return true;" />
</body>
</html>

干杯！！！！

【讨论】：

发帖者询问浏览器工具栏上的后退按钮。