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 相关文章推荐
用JavaScript显示随机图像或引用
Apr 21 Javascript
javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
May 13 Javascript
程序员必知35个jQuery 代码片段
Nov 05 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
Jun 07 Javascript
jQuery实现的瀑布流加载效果示例
Sep 13 Javascript
jquery滚动条插件(可以自定义)
Dec 11 Javascript
浅谈JavaScript正则表达式-非捕获性分组
Mar 08 Javascript
vue-cli之router基本使用方法详解
Oct 17 Javascript
vue配置接口域名方法总结
May 12 Javascript
浅谈layui 表单元素的选中问题
Oct 25 Javascript
js实现数字从零慢慢增加到指定数字示例
Nov 07 Javascript
Vue的双向数据绑定实现原理解析
Feb 17 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
php使用curl并发减少后端访问时间的方法分析
2016/05/12 PHP
php和js实现根据子网掩码和ip计算子网功能示例
2019/11/09 PHP
[转]JS宝典学习笔记
2007/02/07 Javascript
JavaScript学习点滴 call、apply的区别
2010/10/22 Javascript
jquery each的几种常用的使用方法示例
2014/01/21 Javascript
JavaScript获取图片的原始尺寸以宽度为例
2014/05/04 Javascript
22点关于jquery性能优化的建议
2014/05/28 Javascript
jquery使用$(element).is()来判断获取的tagName
2014/08/24 Javascript
javascript使用正则获取url上的某个参数
2014/09/04 Javascript
js+html5实现canvas绘制镂空字体文本的方法
2015/06/05 Javascript
微信小程序 绘图之饼图实现
2016/10/24 Javascript
BootStrap按钮标签及基本样式
2016/11/23 Javascript
基于JS实现弹出一个隐藏的div窗口body页面变成灰色并且不可被编辑
2016/12/14 Javascript
js实现点击按钮弹出上传文件的窗口
2016/12/23 Javascript
vue快捷键与基础指令详解
2017/06/01 Javascript
浅谈jquery中ajax跨域提交的时候会有2次请求的问题
2017/11/10 jQuery
学习RxJS之JavaScript框架Cycle.js
2019/06/17 Javascript
解决Antd Table表头加Icon和气泡提示的坑
2020/11/17 Javascript
从零学Python之入门(五)缩进和选择
2014/05/27 Python
python3.4 将16进制转成字符串的实例
2019/06/12 Python
python批量替换文件名中的共同字符实例
2020/03/05 Python
关于python中remove的一些坑小结
2021/01/04 Python
用HTML5实现手机摇一摇的功能的教程
2012/10/30 HTML / CSS
html5开发三八女王节表白神器
2018/03/07 HTML / CSS
Ralph Lauren拉夫·劳伦美国官网:带有浓郁美国气息的高品味时装品牌
2017/11/01 全球购物
匈牙利墨盒和碳粉购买网站:CDRmarket
2018/04/14 全球购物
艺术设计专业个人求职信范文
2013/12/11 职场文书
2013年学期结束动员演讲稿
2014/01/07 职场文书
教学质量评估实施方案
2014/03/17 职场文书
俞敏洪北大演讲稿
2014/05/22 职场文书
2014小学数学教研组工作总结
2014/12/06 职场文书
庆七一主持词
2015/06/29 职场文书
交流会主持词
2015/07/02 职场文书
幼儿园托班教育随笔
2015/08/14 职场文书
MySQL中in和exists区别详解
2021/06/03 MySQL
新手初学Java List 接口
2021/07/07 Java/Android