基于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 相关文章推荐
用jscript实现新建和保存一个word文档
Jun 15 Javascript
js实现的网页颜色代码表全集
Jul 17 Javascript
iframe子页面与父页面在同域或不同域下的js通信
May 07 Javascript
21个JavaScript事件(Events)属性汇总
Dec 02 Javascript
JSON字符串转JSON对象
Jul 31 Javascript
探析浏览器执行JavaScript脚本加载与代码执行顺序
Jan 12 Javascript
BootStrap iCheck插件全选与获取value值的解决方法
Aug 24 Javascript
微信小程序 tabs选项卡效果的实现
Jan 05 Javascript
Javascript实现数组中的元素上下移动
Apr 28 Javascript
js将键值对字符串转为json字符串的方法
Mar 30 Javascript
修改npm全局安装模式的路径方法
May 15 Javascript
JS实现横向轮播图(初级版)
Jun 24 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 递归效率分析
2009/11/24 PHP
使用图灵api创建微信聊天机器人
2015/07/23 PHP
三个思路解决laravel上传文件报错:413 Request Entity Too Large问题
2017/11/13 PHP
用jscript实现新建和保存一个word文档
2007/06/15 Javascript
脚本安需导入(装载)的三种模式的对比
2007/06/24 Javascript
DOMAssitant最新版 DOMAssistant 2.5发布
2007/12/25 Javascript
12款经典的白富美型—jquery图片轮播插件—前端开发必备
2013/01/08 Javascript
Jquery实现鼠标移上弹出提示框、移出消失思路及代码
2013/05/19 Javascript
查找iframe里元素的方法可传参
2013/09/11 Javascript
JS实现可调整倒计时间代码分享
2015/08/18 Javascript
javascript实现移动端上的触屏拖拽功能
2016/03/04 Javascript
bootstrap3 兼容IE8浏览器!
2016/05/02 Javascript
AngularJS的ng-repeat指令与scope继承关系实例详解
2017/01/21 Javascript
vue几个常用跨域处理方式介绍
2018/02/07 Javascript
Vue核心概念Getter的使用方法
2019/01/18 Javascript
python简单实现基数排序算法
2015/05/16 Python
Python3指定路径寻找符合匹配模式文件
2015/05/22 Python
Python实现螺旋矩阵的填充算法示例
2017/12/28 Python
Python实现发送与接收邮件的方法详解
2018/03/28 Python
儿童学习python的一些小技巧
2018/05/27 Python
python生成密码字典的方法
2018/07/06 Python
在Python中使用Neo4j的方法
2019/03/14 Python
快速排序的四种python实现(推荐)
2019/04/03 Python
CSS3 calc()会计算属性详解
2018/02/27 HTML / CSS
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
十岁生日父母答谢词
2014/01/18 职场文书
浙大毕业生自荐信
2014/01/26 职场文书
学期自我评价
2014/01/27 职场文书
怎样填写就业意向
2014/04/02 职场文书
2015新生加入学生会自荐书
2015/03/24 职场文书
公积金具结保证书
2015/05/11 职场文书
呐喊读书笔记
2015/06/30 职场文书
python获取对象信息的实例详解
2021/07/07 Python
一篇文章带你深入了解Mysql触发器
2021/08/02 MySQL
Win10加载疑难解答时出错发生意外错误的解决方法
2022/07/07 数码科技
win10怎么设置右下角图标不折叠?Win10设置右下角图标不折叠的方法
2022/07/15 数码科技