基于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 相关文章推荐
javascript string字符串优化问题
Jul 31 Javascript
JS中Iframe之间传值及子页面与父页面应用
Mar 11 Javascript
jquery实现滑动图片自己测试的例子
Nov 05 Javascript
js数组转json并在后台对其解析具体实现
Nov 20 Javascript
php+js实现倒计时功能
Jun 02 Javascript
javascript实现淘宝幻灯片广告展示效果
Apr 27 Javascript
js实现兼容IE、Firefox的图片缩放代码
Dec 08 Javascript
jQuery插件扩展测试实例
Jun 21 Javascript
基于Vue渲染与插件的加载顺序的问题详解
Mar 05 Javascript
vue+iview 实现可编辑表格的示例代码
Oct 31 Javascript
解决Vue调用springboot接口403跨域问题
Sep 02 Javascript
js实现秒表计时器
Dec 16 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 中的批处理的实现
2007/06/14 PHP
PHP将Excel导入数据库及数据库数据导出至Excel的方法
2015/06/24 PHP
PHP图片加水印实现方法
2016/05/06 PHP
php实现有序数组打印或排序的方法【附Python、C及Go语言实现代码】
2016/11/10 PHP
php 自定义错误日志实例详解
2016/11/12 PHP
PHP+Redis链表解决高并发下商品超卖问题(实现原理及步骤)
2020/08/03 PHP
JavaScript Event学习第六章 事件的访问
2010/02/07 Javascript
javascript中直接写php代码的方法
2013/07/31 Javascript
基于jQuery实现复选框的全选 全不选 反选功能
2014/11/24 Javascript
jQuery中DOM树操作之使用反向插入方法实例分析
2015/01/23 Javascript
一张Web前端的思维导图分享
2015/07/03 Javascript
深入浅析Bootstrap列表组组件
2016/05/03 Javascript
详解Vue+axios+Node+express实现文件上传(用户头像上传)
2018/08/10 Javascript
vue-cli3+typescript初体验小结
2019/02/28 Javascript
JavaScript+HTML5 canvas实现放大镜效果完整示例
2019/05/15 Javascript
three.js 制作动态二维码的示例代码
2020/07/31 Javascript
Python正则表达式匹配ip地址实例
2014/10/09 Python
Python运用于数据分析的简单教程
2015/03/27 Python
Python中关于Sequence切片的下标问题详解
2017/06/15 Python
python简单实例训练(21~30)
2017/11/15 Python
Python3中关于cookie的创建与保存
2018/10/21 Python
对numpy中二进制格式的数据存储与读取方法详解
2018/11/01 Python
python网络爬虫实现发送短信验证码的方法
2021/02/25 Python
美国手工艺品市场的领导者:Annie’s
2019/04/04 全球购物
时尚孕妇装:HATCH Collection
2019/09/24 全球购物
亚洲在线旅行门户网站:Expedia.com.hk(智游网)
2020/04/14 全球购物
MyBag中文网:英国著名的时尚包袋电商零售网站
2020/07/31 全球购物
Java中的类包括什么内容?设计时要注意哪些方面
2012/05/23 面试题
校三好学生主要事迹
2014/01/11 职场文书
办理居住证介绍信
2014/01/15 职场文书
咖啡馆创业计划书
2014/01/26 职场文书
房地产财务管理制度
2014/02/02 职场文书
本科生导师推荐信范文
2014/05/18 职场文书
2014年督导工作总结
2014/11/19 职场文书
实习单位推荐信
2015/03/27 职场文书
高中班长竞选稿
2015/11/20 职场文书