基于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中使用ajax传输超大数据的解决方法
Jul 14 Javascript
jquery实现一个简单好用的弹出框
Sep 26 Javascript
js实现文本框选中的方法
May 26 Javascript
js省市联动效果完整实例代码
Dec 09 Javascript
js中获取 table节点各tr及td的内容简单实例
Oct 14 Javascript
解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法
May 05 Javascript
jQuery Masonry瀑布流布局神器使用详解
May 25 jQuery
jQuery初级教程之网站品牌列表效果
Aug 02 jQuery
javascript基本常用排序算法解析
Sep 27 Javascript
详解bootstrap导航栏.nav与.navbar区别
Nov 23 Javascript
深入理解webpack process.env.NODE_ENV配置
Feb 23 Javascript
vue中defineProperty和Proxy的区别详解
Nov 30 Vue.js
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
对Session和Cookie的区分与解释
2007/03/16 PHP
解析php中session的实现原理以及大网站应用应注意的问题
2013/06/17 PHP
PHP解决URL中文GBK乱码问题的两种方法
2014/06/03 PHP
微信随机生成红包金额算法php版
2016/07/21 PHP
php 数组处理函数extract详解及实例代码
2016/11/23 PHP
浅谈PHP中的Trait使用方法
2019/03/22 PHP
PHP自动载入类文件函数__autoload的使用方法
2019/03/25 PHP
php设计模式之中介者模式分析【星际争霸游戏案例】
2020/03/23 PHP
javascript 打开页面window.location和window.open的区别
2010/03/17 Javascript
用Mootools获得操作索引的两种方法分享
2011/12/12 Javascript
jQuery 联动日历实现代码
2012/05/31 Javascript
ExtJS下 Ext.Direct加载和提交过程排错小结
2013/04/02 Javascript
JavaScript根据数据生成百分比图和柱状图的实例代码
2013/07/14 Javascript
javascript实现图片延迟加载方法汇总(三种方法)
2015/08/27 Javascript
深入理解js promise chain
2016/05/05 Javascript
AngularJS表格详解及示例代码
2016/08/17 Javascript
JS之相等操作符详解
2016/09/13 Javascript
HTML中setCapture、releaseCapture 使用方法浅析
2016/09/25 Javascript
浅谈jquery高级方法描述与应用
2016/10/04 Javascript
微信小程序仿淘宝热搜词在搜索框中轮播功能
2020/01/21 Javascript
uni-app从安装到卸载的入门教程
2020/05/15 Javascript
prettier自动格式化去换行的实现代码
2020/08/25 Javascript
[02:53]DOTA2亚洲邀请赛 NewBee战队巡礼
2015/02/03 DOTA
[01:11:02]Secret vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
Python+微信接口实现运维报警
2016/08/27 Python
django中的setting最佳配置小结
2017/11/21 Python
详谈套接字中SO_REUSEPORT和SO_REUSEADDR的区别
2018/04/28 Python
CentOS 7 安装python3.7.1的方法及注意事项
2018/11/01 Python
numpy数组做图片拼接的实现(concatenate、vstack、hstack)
2019/11/08 Python
Python+PyQt5+MySQL实现天气管理系统
2020/06/16 Python
关键字final的用法
2013/10/02 面试题
员工培训邀请函
2014/01/11 职场文书
毕业生自我鉴定实例
2014/01/21 职场文书
2016学校先进党组织事迹材料
2016/02/29 职场文书
PyMongo 查询数据的实现
2021/06/28 Python
Pandas搭配lambda组合使用详解
2022/01/22 Python