我正在用PHP做一个在线测试应用程序。我想限制用户在考试中返回。

我尝试了下面的脚本,但它停止了我的计时器。

我该怎么办?

定时器存储在cdtimer.js文件中。

<script type="text/javascript">
    window.history.forward();
    function noBack()
    {
        window.history.forward();
    }
</script>

<body onLoad="noBack();" onpageshow="if (event.persisted) noBack();" onUnload="">

我有一个考试计时器,它从一个MySQL值中获取考试的持续时间。计时器随之启动,但当我输入禁用后退按钮的代码时,它就停止了。我有什么问题?


当前回答

This code will disable the back button for modern browsers which support the HTML5 History API. Under normal circumstances, pushing the back button goes back one step, to the previous page. If you use history.pushState(), you start adding extra sub-steps to the current page. The way it works is, if you were to use history.pushState() three times, then start pushing the back button, the first three times it would navigate back in these sub-steps, and then the fourth time it would go back to the previous page.

如果您将此行为与popstate事件上的事件侦听器结合在一起,您实际上可以建立一个无限循环的子状态。因此,您加载页面,按下一个子状态,然后点击返回按钮,弹出一个子状态,并按下另一个子状态,因此,如果您再次按下返回按钮,它将永远不会没有子状态可按。如果你觉得有必要禁用后退按钮,这将使你达到目的。

history.pushState(null, null, 'no-back-button');
window.addEventListener('popstate', function(event) {
  history.pushState(null, null, 'no-back-button');
});

其他回答

你可以放一个小脚本,然后检查。它将不允许您访问前一页。

这是用JavaScript完成的。

<script type="text/javascript">
    function preventbackbutton() { window.history.forward(); }
    setTimeout("preventbackbutton()", 0);
    window.onunload = function () { null };
</script>

窗外。Onunload函数当您试图通过浏览器访问返回或上一页时触发。

基于@Franklin Innocent F的回答

Kotlin/JS (React)的解决方案:

import org.w3c.dom.events.Event
import kotlin.browser.document
import kotlin.browser.window

...
override fun componentDidMount() {
    window.history.pushState(null, "", window.location.href)
    window.history.back()
    window.history.forward()
    window.addEventListener("popstate", browserBackButtonHandler)
}

...
private val browserBackButtonHandler: (Event?) -> Unit = {
    window.history.go(1)
}

有很多原因可以解释为什么禁用后退按钮实际上不起作用。最好的办法是警告用户:

window.onbeforeunload = function() { return "Your work will be lost."; };

本页确实列出了一些禁用后退按钮的方法,但都不保证:

http://www.irt.org/script/311.htm

这是我为谷歌查询“禁用后退按钮”获得的第一个命中。我的用例与最初发布的问题略有不同。我需要“禁用后退按钮”的用户已登录的一个安全的网站(即防止一个用户从注销,然后另一个用户能够从以前的用户通过点击后退按钮查看信息)。

简而言之,这里的目标是防止用户在登录的用户注销后看到应用程序页面。

这可以通过向经过身份验证的应用程序的页面中添加如下所示的代码来实现。

下面是使用Apache Shiro的完整示例:

https://github.com/NACHC-CAD/web-security-example/releases/tag/v2.0.0

<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="-1" />
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE" />

<script>
    if(performance.navigation.type == 2){
        console.log("Doing reload");   
        location.reload(true);
        console.log("Done with reload");
    }
    console.log("Script loaded.")
</script>

这就是我实现它的方法。

奇怪的是,换窗口。在谷歌Chrome和Safari浏览器中,location无法正常工作。

它发生在那个位置。hash不会在Chrome和Safari的历史记录中创建条目。所以你必须使用推力器。

这在所有浏览器中都适用。

history.pushState({ page: 1 }, "title 1", "#nbb");
window.onhashchange = function (event) {
    window.location.hash = "nbb";
};