js防刷新的倒计时代码 js倒计时代码


Posted in Javascript onSeptember 06, 2017

最近在维护考试系统,在进行考试测试时无意中点击了刷新按钮,但是上面的倒计时并没有受到影响,同时在几篇博客中也有这样的例子,所以我想看看它到底是怎样防止刷新的。

如果是用cs代码写,我们可能会很快的写出来怎样防止刷新,可是我们要进行前段开发,考试是在页面上进行的,这里就要用到我们学到的js了。

<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>

<div id="timer"style="color:red"></div>

 

</body>

</html>

其实,这里最主要的思想就是,我们将时间放到一个变量中,刷新后,我们从变量中接着读取这个数据即可。我们也可以用cookie存开始时间,刷新以后先读取cookie。方法也许不只是这一个,希望大家有更好地方法来多多交流。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Checbox的操作含已选、未选及判断代码
Nov 07 Javascript
Javascript 函数parseInt()转换时出现bug问题
May 20 Javascript
javascript通过元素id和name直接取得元素的方法
Apr 28 Javascript
JS实现的Select三级下拉菜单代码
Aug 20 Javascript
总结javascript中的六种迭代器
Aug 16 Javascript
基于Phantomjs生成PDF的实现方法
Nov 07 Javascript
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 jQuery
教你快速搭建Node.Js服务器的方法教程
Mar 30 Javascript
Vue.js与 ASP.NET Core 服务端渲染功能整合
Nov 16 Javascript
Vue.js 2.x之组件的定义和注册图文详解
Jun 19 Javascript
Vue路由之JWT身份认证的实现方法
Aug 26 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
Sep 10 Javascript
JavaScript中运算符规则和隐式类型转换示例详解
Sep 06 #Javascript
详解Vue.js组件可复用性的混合(mixin)方式和自定义指令
Sep 06 #Javascript
轻松玩转BootstrapTable(后端使用SpringMVC+Hibernate)
Sep 06 #Javascript
vue mixins组件复用的几种方式(小结)
Sep 06 #Javascript
JavaScript 中Date对象的格式化代码方法汇总
Sep 06 #Javascript
jquery实现限制textarea输入字数的方法
Sep 06 #jQuery
Vue的百度地图插件尝试使用
Sep 06 #Javascript
You might like
DC四月将推出百页特刊漫画 纪念小丑诞生80周年
2020/04/09 欧美动漫
为php4加入动态flash文件的生成的支持
2006/10/09 PHP
让Json更懂中文(JSON_UNESCAPED_UNICODE)
2011/10/27 PHP
php颜色转换函数hex-rgb(将十六进制格式转成十进制格式)
2013/09/23 PHP
教你如何解密 “ PHP 神盾解密工具 ”
2014/06/20 PHP
Laravel定时任务的每秒执行代码
2019/10/22 PHP
JQuery分别取得每行最后一列和最后一行的示例代码
2013/08/18 Javascript
Ext修改GridPanel数据和字体颜色、css属性等
2014/06/13 Javascript
JS实现一个按钮的方法
2015/02/05 Javascript
nw.js实现类似微信的聊天软件
2015/03/16 Javascript
Jquery实现$.fn.extend和$.extend函数
2016/04/14 Javascript
基于jQuery实现表格内容的筛选功能
2016/08/21 Javascript
理解AngularJs篇:30分钟快速掌握AngularJs
2016/12/23 Javascript
JS路由跳转的简单实现代码
2017/09/21 Javascript
详解微信小程序实现跑马灯效果(附完整代码)
2019/04/29 Javascript
基于vue实现一个禅道主页拖拽效果
2019/05/27 Javascript
解决layui表格的表头不滚动的问题
2019/09/04 Javascript
Vue中使用matomo进行访问流量统计的实现
2019/11/05 Javascript
js cavans实现静态滚动弹幕
2020/05/21 Javascript
vuex实现购物车功能
2020/06/28 Javascript
Python中使用ElementTree解析XML示例
2015/06/02 Python
深入理解Python中的super()方法
2017/11/20 Python
python 动态加载的实现方法
2017/12/22 Python
实例讲解Python脚本成为Windows中运行的exe文件
2019/01/24 Python
python爬虫selenium和phantomJs使用方法解析
2019/08/08 Python
Visual Studio code 配置Python开发环境
2020/09/11 Python
详解CSS3的box-shadow属性制作边框阴影效果的方法
2016/05/10 HTML / CSS
印度尼西亚在线时尚购物网站:ZALORA印尼
2016/08/02 全球购物
销售实习自我鉴定
2013/12/07 职场文书
会计工作心得体会
2014/01/13 职场文书
小学学雷锋活动总结
2014/04/25 职场文书
计生专干事迹
2014/05/28 职场文书
贫困证明书格式及范文
2014/10/15 职场文书
MySQL数据库10秒内插入百万条数据的实现
2021/11/01 MySQL
浅谈MySql整型索引和字符串索引失效或隐式转换问题
2021/11/20 MySQL
vue 自定义组件添加原生事件
2022/04/21 Vue.js