我正在用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值中获取考试的持续时间。计时器随之启动，但当我输入禁用后退按钮的代码时，它就停止了。我有什么问题?
当前回答
非常简单和干净的函数打破向后箭头，而不干扰页面之后。
好处:
Loads instantaneously and restores original hash, so the user isn't distracted by URL visibly changing. The user can still exit by pressing back 10 times (that's a good thing), but not accidentally No user interference like other solutions using onbeforeunload It only runs once and doesn't interfere with further hash manipulations in case you use that to track state Restores original hash, so almost invisible. Uses setInterval, so it doesn't break slow browsers and always works. Pure JavaScript, does not require HTML5 history, works everywhere. Unobtrusive, simple, and plays well with other code. Does not use unbeforeunload which interrupts user with modal dialog. It just works without fuss.
注意:其他一些解决方案使用onbeforeunload。请不要为此目的使用onbeforeunload，当用户试图关闭窗口、点击反向箭头等时，onbeforeunload会弹出一个对话框。像onbeforeunload这样的情态动词通常只适用于很少的情况，比如当它们实际上在屏幕上做了更改并且没有保存它们时，不是为了这个目的。
工作原理
在页面加载时执行 保存您的原始散列(如果URL中有一个)。 依次追加#/noop/{1..10}到哈希 恢复原始哈希
就是这样。没有更多的混乱，没有后台事件监控，没有其他。
在一秒钟内使用它
要部署，只需在页面或JavaScript代码中添加这个:
<script>
/* Break back button */
window.onload = function(){
var i = 0;
var previous_hash = window.location.hash;
var x = setInterval(function(){
i++;
window.location.hash = "/noop/" + i;
if (i==10){
clearInterval(x);
window.location.hash = previous_hash;
}
}, 10);
}
</script>
其他回答
有很多原因可以解释为什么禁用后退按钮实际上不起作用。最好的办法是警告用户:
window.onbeforeunload = function() { return "Your work will be lost."; };
本页确实列出了一些禁用后退按钮的方法，但都不保证:
http://www.irt.org/script/311.htm
我创建一个HTML页面(index.html)。我还在脚本文件夹/目录中创建了一个one (mechanism.js)。然后，根据需要使用form、table、span和div标记将所有内容放在(index.html)中。现在，这里有一个技巧，可以让后退/前进什么都不做!
首先，你只有一页!其次，使用JavaScript与span / div标签隐藏和显示内容在同一页面上，当需要通过常规链接!
在“index . html”:
<td width="89px" align="right" valign="top" style="letter-spacing:1px;">
<small>
<b>
<a href="#" class="traff" onClick="DisplayInTrafficTable();">IN</a>
</b>
</small>
[ <span id="inCountSPN">0</span> ]
</td>
在“mechanism.js”:
function DisplayInTrafficTable()
{
var itmsCNT = 0;
var dsplyIn = "";
for (i=0; i<inTraffic.length; i++)
{
dsplyIn += "<tr><td width='11'></td><td align='right'>" + (++itmsCNT) + "</td><td width='11'></td><td><b>" + inTraffic[i] + "</b></td><td width='11'></td><td>" + entryTimeArray[i] + "</td><td width='11'></td><td>" + entryDateArray[i] + "</td><td width='11'></td></tr>";
}
document.getElementById('inOutSPN').innerHTML =
"" +
"<table border='0' style='background:#fff;'><tr><th colspan='21' style='background:#feb;padding:11px;'><h3 style='margin-bottom:-1px;'>INCOMING TRAFFIC REPORT</h3>" +
DateStamp() +
" - <small><a href='#' style='letter-spacing:1px;' onclick='OpenPrintableIn();'>PRINT</a></small></th></tr><tr style='background:#eee;'><td></td><td><b>###</b></td><td></td><td><b>ID #</b></td><td></td><td width='79'><b>TYPE</b></td><td></td><td><b>FIRST</b></td><td></td><td><b>LAST</b></td><td></td><td><b>PLATE #</b></td><td></td><td><b>COMPANY</b></td><td></td><td><b>TIME</b></td><td></td><td><b>DATE</b></td><td></td><td><b>IN / OUT</b></td><td></td></tr>" +
dsplyIn.toUpperCase() +
"</table>" +
"";
return document.getElementById('inOutSPN').innerHTML;
}
它看起来很复杂，但请注意函数名和调用、嵌入的HTML和span标记id调用。这是为了展示如何将不同的HTML注入到同一页面上的同一个span标签!向后/向前如何影响这个设计?它不能，因为您正在隐藏对象并在同一页面上替换其他对象!
我们如何隐藏和展示?是:
在' mechanism.js '中的函数中，根据需要使用:
document.getElementById('textOverPic').style.display = "none"; //hide
document.getElementById('textOverPic').style.display = ""; //display
在' index.html '内部通过链接调用函数:
<img src="images/someimage.jpg" alt="" />
<span class="textOverPic" id="textOverPic"></span>
and
<a href="#" style="color:#119;font-size:11px;text-decoration:none;letter-spacing:1px;" onclick="HiddenTextsManager(1);">Introduction</a>
<script>
window.location.hash = "no-back-button";
// Again because Google Chrome doesn't insert
// the first hash into the history
window.location.hash = "Again-No-back-button";
window.onhashchange = function(){
window.location.hash = "no-back-button";
}
</script>
对我来说，这是一个购物订单。所以我禁用了按钮。当用户单击返回时，该按钮仍然被禁用。当他们再次点击返回，然后点击页面按钮继续前进时。我知道他们的订单已经提交，然后跳转到另一页。
在页面实际刷新的情况下，将使按钮(理论上)可用;然后，我能够在页面加载反应，订单已经提交，然后也重定向。
你不能也不应该这么做。然而，这可能会有所帮助:
<script type = "text/javascript" >
history.pushState(null, null, 'pagename');
window.addEventListener('popstate', function(event) {
history.pushState(null, null, 'pagename');
});
</script>
这在我的谷歌Chrome和Firefox中工作。
