我正在用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值中获取考试的持续时间。计时器随之启动，但当我输入禁用后退按钮的代码时，它就停止了。我有什么问题?
当前回答
如果你使用的是angular，只需在div或容器div中使用*ngIf=loggedout即可。
在组件中设置变量。如果为真，显示其他路由器将重定向到主页。根据你在路由器文件上的配置。
这工作的登录和注销使用用户名为例。至于其他账户相关页面或内部页面，这将是有点难以防止。您可能需要禁用整个浏览器的nav选项卡。
其他回答
它基本上是分配窗口的“onbeforeunload”事件以及正在进行的文档“mouseenter”/“mouseleave”事件，因此警报只在单击超出文档范围时触发(然后可以是浏览器的后退或前进按钮)
美元(文档)。On ('mouseenter'，函数(e) { 窗口。Onbeforeunload = null; ｝ ); 美元(文档)。On ('mouseleave'，函数(e) { 窗口。onbeforeunload = function(){返回"你的工作将会丢失";}; ｝ );
<html>
<head>
<title>Disable Back Button in Browser - Online Demo</title>
<style type="text/css">
body, input {
font-family: Calibri, Arial;
}
</style>
<script type="text/javascript">
window.history.forward();
function noBack() {
window.history.forward();
}
</script>
</head>
<body onload="noBack();" onpageshow="if (event.persisted) noBack();" onunload="">
<H2>Demo</H2>
<p>This page contains the code to avoid Back button.</p>
<p>Click here to Goto <a href="noback.html">NoBack Page</a></p>
</body>
</html>
只需设置location.hash="Something"。在按下返回按钮时，散列将从URL中删除，但页面不会返回。
此方法用于防止意外返回，但出于安全性考虑，您应该设计用于防止应答的后端。
这里的一些解决方案不会阻止回退事件的发生——它们让回退事件发生(浏览器内存中关于页面的数据丢失)，然后它们播放一个向前事件，试图隐藏回退事件刚刚发生的事实。如果页面处于暂时状态，则该方法将不成功。
我为React写了这个解决方案(当React路由器不被使用时)，它是基于vrfvr的答案。
它将真正阻止后退按钮做任何事情，除非用户确认弹出:
const onHashChange = useCallback(() => {
const confirm = window.confirm(
'Warning - going back will cause you to loose unsaved data. Really go back?',
);
window.removeEventListener('hashchange', onHashChange);
if (confirm) {
setTimeout(() => {
window.history.go(-1);
}, 1);
} else {
window.location.hash = 'no-back';
setTimeout(() => {
window.addEventListener('hashchange', onHashChange);
}, 1);
}
}, []);
useEffect(() => {
window.location.hash = 'no-back';
setTimeout(() => {
window.addEventListener('hashchange', onHashChange);
}, 1);
return () => {
window.removeEventListener('hashchange', onHashChange);
};
}, []);
在现代浏览器中，这似乎是可行的:
// https://developer.mozilla.org/en-US/docs/Web/API/History_API
let popHandler = () => {
if (confirm('Go back?')) {
window.history.back()
} else {
window.history.forward()
setTimeout(() => {
window.addEventListener('popstate', popHandler, {once: true})
}, 50) // delay needed since the above is an async operation for some reason
}
}
window.addEventListener('popstate', popHandler, {once: true})
window.history.pushState(null,null,null)
