Home > Article > Web Front-end > js implements anti-refresh countdown code display
js implements anti-refresh countdown code display
- 巴扎黑Original
- 2017-09-07 11:41:121130browse
This article mainly introduces the js anti-refresh countdown code and the js countdown implementation code in detail, which has a certain reference value. Interested friends can refer to it
Recent maintenance exam System, I accidentally clicked the refresh button during the exam test, but the countdown above was not affected. There are also such examples in several blogs, so I want to see how it prevents refresh.
If it is written in cs code, we may quickly write out how to prevent refreshing, but we need to carry out front-end development, and the exam is conducted on the page, and the js we have learned will be used here. .
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=gb2312" />
<title>前端开发</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
var maxtime;
if(window.name==''){
maxtime = 1*60;
}else{
maxtime = window.name;
}
function CountDown(){
if(maxtime>=0){
minutes = Math.floor(maxtime/60);
seconds = Math.floor(maxtime%60);
msg = "距离考试结束还有"+minutes+"分"+seconds+"秒";
document.all["timer"].innerHTML = msg;
if(maxtime == 5*60) alert('注意，还有5分钟!');
--maxtime;
window.name = maxtime;
}
else{
clearInterval(timer);
alert("考试时间到，结束!");
}
}
timer = setInterval("CountDown()",1000);
//-->
</SCRIPT>
<p id="timer"style="color:red"></p>
</body>
</html>In fact, the main idea here is that we put the time in a variable, and after refreshing, we can then read the data from the variable. We can also use cookies to store the start time, and read the cookie first after refreshing. There may be more than just this method. I hope everyone has a better way to communicate.
The above is the detailed content of js implements anti-refresh countdown code display. For more information, please follow other related articles on the PHP Chinese website!