基于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 相关文章推荐
初识JQuery 实例一(first)
Mar 16 Javascript
jquery 选项卡效果 新手代码
Jul 08 Javascript
jquery插件推荐浏览器嗅探userAgent
Nov 09 Javascript
javascript实现图片循环渐显播放的方法
Feb 24 Javascript
js中的内部属性与delete操作符介绍
Aug 10 Javascript
javascript实现很浪漫的气泡冒出特效
Sep 05 Javascript
微信小程序 scroll-view实现锚点滑动的示例
Dec 06 Javascript
Node.js npm命令运行node.js脚本的方法
Oct 10 Javascript
JavaScript实现的3D旋转魔方动画效果实例代码
Jul 31 Javascript
js实现文章目录索引导航(table of content)
May 10 Javascript
vue+element-ui表格封装tag标签使用插槽
Jun 18 Javascript
uniapp实现横向滚动选择日期
Oct 21 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/01/08 PHP
php使用多个进程同时控制文件读写示例
2014/02/28 PHP
PHP正则表达式替换站点关键字链接后空白的解决方法
2014/09/16 PHP
php中get_defined_constants函数用法实例分析
2015/05/12 PHP
php编程每天必学之表单验证
2016/03/01 PHP
php生成mysql的数据字典
2016/07/07 PHP
PHP经典算法集锦【经典收藏】
2016/09/14 PHP
在线编辑器中换行与内容自动提取
2009/04/24 Javascript
jquery 动态创建元素的方式介绍及应用
2013/04/21 Javascript
JavaScript函数节流和函数防抖之间的区别
2017/02/15 Javascript
详谈表单格式化插件jquery.serializeJSON
2017/06/23 jQuery
一步一步的了解webpack4的splitChunk插件(小结)
2018/09/17 Javascript
javascript实现蒙版与禁止页面滚动
2020/01/11 Javascript
vue实现移动端H5数字键盘组件使用详解
2020/08/25 Javascript
JS实现按比例缩小图片宽高
2020/08/24 Javascript
[53:15]Newbee vs Pain 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python通过正则查找微博@(at)用户的方法
2015/03/13 Python
python获取指定目录下所有文件名列表的方法
2015/05/20 Python
Selenium控制浏览器常见操作示例
2018/08/13 Python
opencv中图像叠加/图像融合/按位操作的实现
2020/04/01 Python
Pyinstaller 打包发布经验总结
2020/06/02 Python
国际象棋商店:The Chess Store
2018/07/09 全球购物
SEPHORA丝芙兰德国官方购物网站:化妆品、护肤品和香水
2020/01/21 全球购物
N:Philanthropy官网:美国洛杉矶基础款服装
2020/06/09 全球购物
双语教学实施方案
2014/03/23 职场文书
家长会演讲稿
2014/04/26 职场文书
爱心活动计划书
2014/04/26 职场文书
高中教师先进事迹材料
2014/08/22 职场文书
运动会加油稿100字
2014/09/19 职场文书
北京颐和园导游词
2015/01/30 职场文书
工作年限证明范本
2015/06/15 职场文书
获奖感言怎么写
2015/07/31 职场文书
药品销售员2015年终工作总结
2015/10/22 职场文书
高一化学教学反思
2016/02/22 职场文书
聊一聊Redis与MySQL双写一致性如何保证
2021/06/26 Redis
Go语言编译原理之变量捕获
2022/08/05 Golang