基于jQuery+Cookie实现的防止刷新的在线考试倒计时


Posted in Javascript onJune 19, 2015

基于jQuery+Cookie实现的防止刷新的在线考试倒计时

$(function() {
      var _minute = parseInt("${exampaper.paperTime }");
      var _expiresHours = _minute * 60 * 1000;
        
      if(!hasSetCookie()){
        addCookie("${examinee.examineeId}", _expiresHours, _expiresHours);
      } 
      settime($("#remainTime")); 
    });
    function hasSetCookie(){
      var strCookie = document.cookie;
      var arrCookie = strCookie.split("; ");
      for (var i = 0; i < arrCookie.length; i++) {
        var arr = arrCookie[i].split("=");
        if (arr[0] == "${examinee.examineeId}") {
          return true;
        }
      };
      return false;
    }
    //开始倒计时
    function settime(remainTime) {
      var _time = getCookieValue("871d31bacfd4451484c5f70f8860c2a9");
      var _countdown = parseInt(getCookieValue("${examinee.examineeId}")) / 1000;
       
      if (_countdown <= 0) {
        alert("考试时间到!");
        endExam();
      } else {
        var _second = _countdown % 60;
        var _minute = parseInt(_countdown / 60) % 60;
        var _hour = parseInt(parseInt(_countdown / 60) / 60);
 
        if (_hour < 10)
          _hour = "0" + _hour.toString();
        if (_second < 10)
          _second = "0" + _second.toString();
        if (_minute < 10)
          _minute = "0" + _minute.toString();
 
        remainTime.html(_hour + ":" + _minute + ":" + _second);
        _countdown--;
        editCookie("${examinee.examineeId}", _countdown * 1000, _countdown * 1000);
      }
      //每1000毫秒执行一次
      setTimeout(function() {
        settime(remainTime);
      }, 1000);
    };
 
    //时添加cookie
    function addCookie(name, value, expiresHours) {
      var cookieString = name + "=" + escape(value); //escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串。
      //判断是否设置过期时间,0代表关闭浏览器时失效
      if (expiresHours > 0) {
        var date = new Date();
        date.setTime(date.getTime() + expiresHours * 1000);
        cookieString = cookieString + ";expires=" + date.toUTCString();
      }
      document.cookie = cookieString;
    }
 
    //修改cookie的值
    function editCookie(name, value, expiresHours) {
      var cookieString = name + "=" + escape(value);
      if (expiresHours > 0) {
        var date = new Date();
        date.setTime(date.getTime() + expiresHours * 1000); //单位是毫秒
        cookieString = cookieString + ";expires=" + date.toGMTString();
      }
      document.cookie = cookieString;
    }
 
    //根据名字获取cookie的值
    function getCookieValue(name) {
      var strCookie = document.cookie;
      var arrCookie = strCookie.split("; ");
      for (var i = 0; i < arrCookie.length; i++) {
        var arr = arrCookie[i].split("=");
        if (arr[0] == name) {
          return unescape(arr[1]);
          break;
        } else {
          continue;
        };
      };
    }

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
一端时间轮换的广告
Jun 26 Javascript
javascript 字符 Escape,encodeURI,encodeURIComponent
Jul 09 Javascript
js parentElement和offsetParent之间的区别
Mar 23 Javascript
jquery.simple.tree插件 更简单,兼容性更好的无限树插件
Sep 03 Javascript
JS对象与JSON格式数据相互转换
Feb 20 Javascript
jquery+javascript编写国籍控件
Feb 12 Javascript
Ajax使用原生态JS验证用户名是否存在
May 26 Javascript
AngularJS动态绑定HTML的方法分析
Nov 07 Javascript
vue-cli2打包前和打包后的css前缀不一致的问题解决
Aug 24 Javascript
vue3.0实现点击切换验证码(组件)及校验
Nov 18 Vue.js
详解微信小程序「渲染层网络层错误」的解决方法
Jan 06 Javascript
uniapp微信小程序:key失效的解决方法
Jan 20 Javascript
MVVM模式中ViewModel和View、Model有什么区别?
Jun 19 #Javascript
JavaScript中数据结构与算法(五):经典KMP算法
Jun 19 #Javascript
使用AngularJS编写较为优美的JavaScript代码指南
Jun 19 #Javascript
javascript格式化日期时间方法汇总
Jun 19 #Javascript
JavaScript中数据结构与算法(四):串(BF)
Jun 19 #Javascript
JavaScript中数据结构与算法(三):链表
Jun 19 #Javascript
js结合正则实现国内手机号段校验
Jun 19 #Javascript
You might like
php查找任何页面上的所有链接的方法
2013/12/03 PHP
thinkphp中memcache的用法实例
2014/11/29 PHP
PHP实践教程之过滤、验证、转义与密码详解
2017/07/24 PHP
php校验公钥是否可用的实例方法
2019/09/17 PHP
jQuery 标题的自动翻转实现代码
2009/10/14 Javascript
JavaScript是否可实现多线程  深入理解JavaScript定时机制
2009/12/22 Javascript
关于jquery input textare 事件绑定及用法学习
2013/04/03 Javascript
javascript利用apply和arguments复用方法
2013/11/25 Javascript
javascript实现信息的显示和隐藏如注册页面
2013/12/03 Javascript
javascript运行机制之this详细介绍
2014/02/07 Javascript
Jquery中$.post和$.ajax的用法小结
2015/04/28 Javascript
利用jquery制作滚动到指定位置触发动画
2016/03/26 Javascript
详解jQuery中关于Ajax的几个常用的函数
2017/07/17 jQuery
Grunt针对静态文件的压缩,版本控制打包的实例讲解
2017/09/29 Javascript
JavaScript中Object基础内部方法图
2018/02/05 Javascript
cdn模式下vue的基本用法详解
2018/10/07 Javascript
详解 javascript对象创建模式
2020/10/30 Javascript
[06:16]第十四期-国士无双绝地翻盘之撼地神牛
2014/06/24 DOTA
[01:21]DOTA2周边文化主题展 神秘商店火热开售
2017/07/30 DOTA
Python修改Excel数据的实例代码
2013/11/01 Python
使用wxpython实现的一个简单图片浏览器实例
2014/07/10 Python
详解Python Socket网络编程
2016/01/05 Python
django 开发忘记密码通过邮箱找回功能示例
2018/04/17 Python
浅析python继承与多重继承
2018/09/13 Python
Python 利用scrapy爬虫通过短短50行代码下载整站短视频
2018/10/29 Python
python修改文件内容的3种方法详解
2019/11/15 Python
Python正则表达式学习小例子
2020/03/03 Python
15个Pythonic的代码示例(值得收藏)
2020/10/29 Python
python Autopep8实现按PEP8风格自动排版Python代码
2021/03/02 Python
HTML5 本地存储实现购物车功能
2017/09/07 HTML / CSS
欧洲有机婴儿食品最大的市场:Organic Baby Food(供美国和加拿大)
2018/03/28 全球购物
Linux机考试题
2015/07/17 面试题
六一儿童节演讲稿
2014/05/23 职场文书
2014年机关党建工作总结
2014/11/11 职场文书
班级管理经验交流材料
2015/11/02 职场文书
TypeScript 使用 Tuple Union 声明函数重载
2022/04/07 Javascript