基于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 相关文章推荐
纯CSS打造的导航菜单(附jquery版)
Aug 07 Javascript
jQuery-Easyui 1.2 实现多层菜单效果的代码
Jan 13 Javascript
jquery中.add()的使用分析
Apr 26 Javascript
js图片处理示例代码
May 12 Javascript
JS+CSS实现模仿浏览器网页字符查找功能的方法
Feb 26 Javascript
JavaScript通过元素索引号删除数组中对应元素的方法
Mar 18 Javascript
javascript日期处理函数,性能优化批处理
Sep 06 Javascript
js从数组中删除指定值(不是指定位置)的元素实现代码
Sep 13 Javascript
bootstrap table复杂操作代码
Nov 01 Javascript
vue watch自动检测数据变化实时渲染的方法
Jan 16 Javascript
微信小程序解析富文本过程详解
Jul 13 Javascript
js设计模式之单例模式原理与用法详解
Aug 15 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 正确解码javascript中通过escape编码后的字符
2010/01/28 PHP
php获取给定日期相差天数的方法分析
2017/02/20 PHP
jQuery学习笔记之jQuery的DOM操作
2010/12/22 Javascript
javascript 实现字符串反转的三种方法
2013/11/23 Javascript
常用的几段javascript代码分享
2014/03/25 Javascript
Javascript遍历Html Table示例(包括内容和属性值)
2014/07/08 Javascript
node.js适合游戏后台开发吗?
2014/09/03 Javascript
JavaScript常用标签和方法总结
2015/09/01 Javascript
Bootstrap开关(switch)控件学习笔记分享
2016/05/30 Javascript
在web中js实现类似excel的表格控件
2016/09/01 Javascript
AngularJS入门教程之模块化操作用法示例
2016/11/02 Javascript
Vue.js使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用
2017/05/10 Javascript
vue2.0的虚拟DOM渲染思路分析
2018/08/09 Javascript
微信小程序用户位置权限的获取方法(拒绝后提醒)
2018/11/15 Javascript
JavaScript运动原理基础知识详解
2020/04/02 Javascript
一则python3的简单爬虫代码
2014/05/26 Python
Python程序设计入门(4)模块和包
2014/06/16 Python
17个Python小技巧分享
2015/01/23 Python
在Python中操作时间之tzset()方法的使用教程
2015/05/22 Python
Python中threading模块join函数用法实例分析
2015/06/04 Python
在Django的session中使用User对象的方法
2015/07/23 Python
python 简单的多线程链接实现代码
2016/08/28 Python
Python 专题一 函数的基础知识
2017/03/16 Python
python3基于TCP实现CS架构文件传输
2018/07/28 Python
python 将dicom图片转换成jpg图片的实例
2020/01/13 Python
python中对二维列表中一维列表的调用方法
2020/06/07 Python
Django如何使用asyncio协程和ThreadPoolExecutor多线程
2020/10/12 Python
Python调用飞书发送消息的示例
2020/11/10 Python
python 基于Apscheduler实现定时任务
2020/12/15 Python
浅析CSS3 用text-overflow解决文字排版问题
2020/10/28 HTML / CSS
美国隐形眼镜网:Major Lens
2018/02/09 全球购物
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
合作协议书怎么写
2014/04/18 职场文书
于丹论语心得观后感
2015/06/15 职场文书
javascript的var与let,const之间的区别详解
2022/02/18 Javascript
微信小程序实现轮播图指示器
2022/06/25 Javascript