我正在用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值中获取考试的持续时间。计时器随之启动，但当我输入禁用后退按钮的代码时，它就停止了。我有什么问题?
当前回答
我觉得jordanhollinger.com上的这篇文章是最好的选择。与Razor的答案相似，但更清楚一些。下面的代码;全部归功于Jordan Hollinger:
页面:
<a href="/page-of-no-return.htm#no-back>You can't go back from the next page</a>
no return的JavaScript页面:
// It works without the History API, but will clutter up the history
var history_api = typeof history.pushState !== 'undefined'
// The previous page asks that it not be returned to
if ( location.hash == '#no-back' ) {
// Push "#no-back" onto the history, making it the most recent "page"
if ( history_api ) history.pushState(null, '', '#stay')
else location.hash = '#stay'
// When the back button is pressed, it will harmlessly change the url
// hash from "#stay" to "#no-back", which triggers this function
window.onhashchange = function() {
// User tried to go back; warn user, rinse and repeat
if ( location.hash == '#no-back' ) {
alert("You shall not pass!")
if ( history_api ) history.pushState(null, '', '#stay')
else location.hash = '#stay'
}
}
}
其他回答
<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>
我觉得jordanhollinger.com上的这篇文章是最好的选择。与Razor的答案相似，但更清楚一些。下面的代码;全部归功于Jordan Hollinger:
页面:
<a href="/page-of-no-return.htm#no-back>You can't go back from the next page</a>
no return的JavaScript页面:
// It works without the History API, but will clutter up the history
var history_api = typeof history.pushState !== 'undefined'
// The previous page asks that it not be returned to
if ( location.hash == '#no-back' ) {
// Push "#no-back" onto the history, making it the most recent "page"
if ( history_api ) history.pushState(null, '', '#stay')
else location.hash = '#stay'
// When the back button is pressed, it will harmlessly change the url
// hash from "#stay" to "#no-back", which triggers this function
window.onhashchange = function() {
// User tried to go back; warn user, rinse and repeat
if ( location.hash == '#no-back' ) {
alert("You shall not pass!")
if ( history_api ) history.pushState(null, '', '#stay')
else location.hash = '#stay'
}
}
}
你不能也不应该这么做。然而，这可能会有所帮助:
<script type = "text/javascript" >
history.pushState(null, null, 'pagename');
window.addEventListener('popstate', function(event) {
history.pushState(null, null, 'pagename');
});
</script>
这在我的谷歌Chrome和Firefox中工作。
我创建一个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>
只需立即运行代码片段并尝试返回 历史。pushState(null, null, window.location.href); history.back (); 窗口。Onpopstate = () => history.forward();
