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 相关文章推荐
学习js在线html(富文本,所见即所得)编辑器
Dec 18 Javascript
JS原型对象通俗&quot;唱法&quot;
Dec 27 Javascript
jQuery之ajax技术的详细介绍
Jun 19 Javascript
JavaScript学习笔记之ES6数组方法
Mar 25 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
Dec 26 Javascript
利用jQuery实现滑动开关按钮效果(附demo源码下载)
Feb 07 Javascript
微信小程序页面生命周期详解
Jan 31 Javascript
Vue单页面应用保证F5强刷不清空数据的解决方案
Jan 31 Javascript
如何用webpack4带你实现一个vue的打包的项目
Jun 20 Javascript
element UI upload组件上传附件格式限制方法
Sep 04 Javascript
Vue项目数据动态过滤实践及实现思路
Sep 11 Javascript
vue中h5端打开app(判断是安卓还是苹果)
Feb 26 Vue.js
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查看当前Session的ID实例
2015/03/16 PHP
php实现smarty模板无限极分类的方法
2015/12/07 PHP
PHP让网站移动访问更加友好方法
2019/02/14 PHP
jQuery1.6 正式版发布并提供下载
2011/05/05 Javascript
javascript使用百度地图api和html5特性获取浏览器位置
2014/01/10 Javascript
在JavaScript中处理字符串之link()方法的使用
2015/06/08 Javascript
页面内容排序插件jSort使用方法
2015/10/10 Javascript
Boostrap实现的登录界面实例代码
2016/10/09 Javascript
两种简单的跨域方法(jsonp、php)
2017/01/02 Javascript
vue-router路由简单案例介绍
2017/02/21 Javascript
gulp解决跨域的配置文件问题
2017/06/08 Javascript
基于nodejs实现微信支付功能
2017/12/20 NodeJs
详解Vue组件之作用域插槽
2018/11/22 Javascript
js轮播图之旋转木马效果
2020/10/13 Javascript
在Python3中使用asyncio库进行快速数据抓取的教程
2015/04/02 Python
python操作oracle的完整教程分享
2018/01/30 Python
python爬虫框架scrapy实现模拟登录操作示例
2018/08/02 Python
python实现朴素贝叶斯算法
2018/11/19 Python
python简单区块链模拟详解
2019/07/03 Python
python实现BP神经网络回归预测模型
2019/08/09 Python
Python 将json序列化后的字符串转换成字典(推荐)
2020/01/06 Python
Python标准库itertools的使用方法
2020/01/17 Python
Python实现序列化及csv文件读取
2020/01/19 Python
python2.7使用scapy发送syn实例
2020/05/05 Python
对python中list的五种查找方法说明
2020/07/13 Python
Django实现文章详情页面跳转代码实例
2020/09/16 Python
移动端HTML5开发神器之vconsole详解
2020/12/15 HTML / CSS
英国度假别墅预订:Sykes Cottages
2017/06/12 全球购物
PHP引擎php.ini参数优化深入讲解
2021/03/24 PHP
应届生自我鉴定
2013/12/11 职场文书
安全生产承诺书范文
2014/05/22 职场文书
个性车贴标语
2014/06/24 职场文书
2015年青年志愿者工作总结
2015/05/20 职场文书
Python爬虫爬取全球疫情数据并存储到mysql数据库的步骤
2021/03/29 Python
mysql知识点整理
2021/04/05 MySQL
uniapp开发小程序的经验总结
2021/04/08 Javascript