基于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监测ActiveX控件是否已经安装过的代码
Sep 02 Javascript
jQuery 表单验证扩展代码(一)
Oct 11 Javascript
另一个javascript小测验(代码集合)
Jul 27 Javascript
12行javascript代码绘制一个八卦图
Apr 02 Javascript
javascript实现简单的省市区三级联动
May 14 Javascript
浅谈javascript原型链与继承
Jul 13 Javascript
微信小程序开发(一) 微信登录流程详解
Jan 11 Javascript
浅谈angularjs $http提交数据探索
Jan 20 Javascript
js的继承方法小结(prototype、call、apply)(推荐)
Apr 17 Javascript
了解Javascript中函数作为对象的魅力
Jun 19 Javascript
javascript事件循环event loop的简单模型解释与应用分析
Mar 14 Javascript
vue 计算属性和侦听器的使用小结
Jan 25 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
php 页面执行时间计算代码
2008/12/04 PHP
php图像处理函数大全(推荐收藏)
2013/07/11 PHP
php多任务程序实例解析
2014/07/19 PHP
php中smarty模板条件判断用法实例
2015/06/11 PHP
thinkPHP线上自动加载异常与修复方法实例分析
2016/12/01 PHP
利用PHP判断文件是否为图片的方法总结
2017/01/06 PHP
基于JQuery的列表拖动排序实现代码
2013/10/01 Javascript
JS实现的用来对比两个用指定分隔符分割的字符串是否相同
2014/09/19 Javascript
js实现超简单的展开、折叠目录代码
2015/08/28 Javascript
js实现交通灯效果
2017/01/13 Javascript
JavaScript中的普通函数和箭头函数的区别和用法详解
2017/03/21 Javascript
jQuery回调方法使用示例
2017/06/26 jQuery
vue+swiper实现侧滑菜单效果
2017/12/28 Javascript
详解vue axios二次封装
2018/07/22 Javascript
create-react-app 修改为多入口编译的方法
2018/08/01 Javascript
解决vue路由后界面没有变化,但是链接有的问题
2018/09/01 Javascript
vue组件之间的数据传递方法详解
2019/04/19 Javascript
Vue3 中的数据侦测的实现
2019/10/09 Javascript
Python AES加密实例解析
2018/01/18 Python
基于tensorflow加载部分层的方法
2018/07/26 Python
AUC计算方法与Python实现代码
2020/02/28 Python
python Selenium 库的使用技巧
2020/10/16 Python
python 下载m3u8视频的示例代码
2020/11/11 Python
CSS3盒子模型详解
2013/04/24 HTML / CSS
canvas使用注意点总结
2013/07/19 HTML / CSS
html5本地存储之localstorage 、本地数据库、sessionStorage简单使用示例
2014/05/08 HTML / CSS
HTML5微信播放全屏问题的解决方法
2017/03/09 HTML / CSS
施工班组长岗位职责
2014/01/05 职场文书
计算机学生的自我评价分享
2014/02/18 职场文书
人代会标语
2014/06/30 职场文书
党员干部反四风对照检查材料思想汇报
2014/09/14 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
2015教师节通讯稿
2015/07/20 职场文书
毕业典礼致辞
2015/07/29 职场文书
党风廉洁教育心得体会
2016/01/20 职场文书
《地震中的父与子》教学反思
2016/02/16 职场文书