代码之家 › 专栏 › 技术社区 › kemiller2002

防止使用后退按钮(在IE中)

back-button internet-explorer javascript

kemiller2002 · 技术社区 · 16 年前

所以我现在工作的地方的中小企业想尝试禁用某些页面的后退按钮。我们有一个页面,用户可以在其中进行一些选择并提交它们进行处理。在某些情况下,他们必须在另一个页面上输入评论。

用户发现,如果他们提交了信息并使用评论转到页面,然后单击“上一步”按钮返回上一页,则不必输入评论。

我知道有几种不同的解决方案(其中许多比禁用后退按钮更优雅),但这就是我剩下的。是否可以通过更改后退按钮的行为来阻止某人返回上一页。(类似于submit->return false sorta事物)。

由于双重发布信息,我不能让它返回到上一页,然后移动到当前页。我只能让它不直接离开当前页面。我在谷歌上搜索了一下,但我只看到一些帖子说它会一直返回到上一页。我希望有人有一些疯狂的功夫技能,可以使这成为可能。

我知道每个人都说这是个坏主意,我也同意,但有时你只需要做你被告知的事情。

15 回复 | 直到 16 年前

Keith 16 年前

不要这样做,只是不要这样做。这是一个糟糕的界面设计,并迫使用户的浏览器的行为方式,他们不期望。

我认为任何成功阻止我的back按钮工作的脚本都是一个黑客,我希望IE团队为它发布一个安全补丁。

后退按钮是他们程序界面的一部分,而不是你的网站。

在您的特定情况下,我认为最好的办法是在页面中添加卸载事件,警告用户如果尚未完成表单。后退按钮将不受影响,用户将被警告他们的行动。

Jon Limjap 16 年前

不,你死定了。即使在不同的浏览器中弹出页面并隐藏“后退”按钮,也始终存在退格键。

市场营销人员和分析师的问题是,他们中的一些人不理解网络无状态的基本概念。他们不明白网页完全,完全不知道浏览器在使用它,对浏览器的绝对控制完全超出了网页的能力。

阻止用户点击后退按钮的最好方法是确保页面丢失 全部的 当他们按下后退时,它的数据,例如,评论页面是唯一可以保存数据的地方,如果他们按下后退按钮,他们必须这样做一切再重复一遍(按照pragma:nocache的思路思考)。

用户会抱怨,当然,但这就是为什么这种需求存在,对吗?

David Mohundro alexsmn 16 年前

我以前见过:

window.onBack = history.forward();

这绝对是一个肮脏的黑客,如果可能的话,我会尝试不禁用后退按钮用户可能仍然可以很容易地绕过它。根据缓存的不同,不知道是否会处理服务器代码,或者是否首先运行带有JavaScript的缓存页。

所以,是的,使用时请自行承担风险:)

Maruthi Yossi Shasho 9 年前

我想出了一个小技巧,用JavaScript禁用back按钮。我在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";
}
// If you want to skip the auto-positioning at the top of browser window,you can add the below code:
window.location.hash=' ';
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 the back button!
</body>
</html>

sergtk 16 年前

您有权访问服务器端源代码吗如果是这样,您可以在第一页上进行检查,如果信息已经提交,则会重定向到第二页(显然,您需要为此使用会话)。在以前的工作中,这是我们处理多步骤应用程序(应用程序,如申请接受)的方式。

Joel Coehoorn 16 年前

你能把评论移到上一页并把它变成一个必需的字段吗?

禁用后退按钮 不会起作用的。

pkaeding 16 年前

由于浏览器中javascript的安全隔离,您无法更改back按钮的功能。

也许您可以在用户会话中存储一些指示需要评论的内容,并在应用程序中让用户尝试加载的任何页面重定向到评论页面?

如果用户在进入评论页面时关闭浏览器怎么办?

我知道你在这里没有选择的余地,但既然他们的要求似乎是不可能的。。。

在用户输入注释之前,您可能无法将项目视为已完成。因此,您需要跟踪正在进行的项和已完成的项,并在UI中进行区分,但这可能是最健壮的方法。

或者只在表单页面上添加注释字段?

Peter Hilton 16 年前

用户发现的是他们不必进入如果他们提交信息,请发表评论然后转到带有评论的页面然后按后退按钮返回上一页。

那么他们可能也足够聪明打字了 '无可奉告' 进入评论栏。

你可以试着强迫人们添加评论,但你很可能只会得到不好的不可用软件,惹恼用户,仍然得不到评论。这通常是一个退一步,从用户的角度重新考虑你在做什么的好时机。

Guy Starbuck 16 年前

禁用后退按钮似乎是一种“蛮力”方法。

另一个选项是,您可以跳出到没有命令按钮的模式对话框,引导用户浏览工作流,并在流程完成时关闭对话框。

Kornel 16 年前

你应该保护你的应用程序不被重复提交,而不是破坏用户界面来隐藏错误。

Matt Dawdy 16 年前

要做到这一点根本没有可靠的方法。你不能保证100%的时间你可以阻止用户这样做。

考虑到这一点,是否值得去寻找极端奇异的解决方案,以禁用“大多数”的时间?那由你决定。

祝你好运。

Andy 15 年前

简单地说:试试这个。在其中插入一个更新面板和一个按钮,并使用javascript隐藏它,然后在页面加载时按它。是的,我知道这将导致您的页面在加载时返回,如果禁用javascript,则可能无法工作,但肯定会帮助您对返回按钮问题获得半正确的响应。安迪

Webveloper 12 年前

你可以阻止他们返回上一页。 location.replace() 将当前页的历史记录条目替换为新页,因此。。。

page1.html:用户单击指向page2.html的链接

page2.html:用户单击调用 location.replace('page3.html');

page3.html:用户单击后退按钮并转到page1.html

这可能不适合发布,但是您可以通过AJAX将数据发布到web服务,然后调用location.replace()

Sam Watkins 9 年前

如果你从头开始一个新的web应用程序,或者你有足够的时间重新设计你的应用程序,你可以使用JavaScript和AJAX来避免浏览器的历史、后退和前进功能。

在登录前或登录后立即在新窗口中打开应用程序。
如果愿意,使用窗口选项隐藏导航栏(使用后退和前进按钮)。
对所有服务器请求使用AJAX,而不必更改窗口的位置URL。
使用简单的web API获取数据并执行操作,然后使用JavaScript呈现应用程序。
窗口历史记录中只有一个URL。
后退和前进按钮都不起作用。
该窗口可以在注销时自动关闭。
没有信息泄露到浏览器历史记录中,这有助于提高安全性。

这项技术回答了问题,但它也在以下几个方面与最佳实践相矛盾:

后退和前进按钮应按预期操作。
应用程序不应打开新的浏览器窗口。
应用程序在没有JavaScript的情况下仍然可以运行。

在使用此技术之前,请仔细考虑您的需求和用户。

Denis Chenu 9 年前

我看不出这个解决方案:

function removeBack(){
	window.location.hash="nbb";
	window.location.hash="";
	window.onhashchange=function(){window.location.hash="";}
}