基于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 相关文章推荐
很多人都是用下面的js刷新站IP和PV
Sep 05 Javascript
xss文件页面内容读取(解决)
Nov 28 Javascript
ajax页面无刷新 IE下遭遇Ajax缓存导致数据不更新的问题
Dec 11 Javascript
js操作滚动条事件实例
Jan 29 Javascript
javascript正则表达式之分组概念与用法实例
Jun 16 Javascript
值得分享的JavaScript实现图片轮播组件
Nov 21 Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
May 25 Javascript
JavaScript异步上传图片文件的实例代码
Jul 04 Javascript
基于JS代码实现简单易用的倒计时 x 天 x 时 x 分 x 秒效果
Jul 13 Javascript
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
Oct 19 jQuery
如何实现一个简易版的vuex持久化工具
Sep 11 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/02/22 PHP
PHP实现邮件群发的源码
2013/06/18 PHP
PHP使用pear自带的mail类库发邮件的方法
2015/07/08 PHP
PHP文件上传操作实例详解
2016/09/27 PHP
Nginx下ThinkPHP5的配置方法详解
2017/08/01 PHP
Prototype使用指南之string.js
2007/01/10 Javascript
基于jquery的当鼠标滚轮到最底端继续加载新数据思路分享(多用于微博、空间、论坛 )
2011/10/10 Javascript
jquery()函数的三种语法介绍
2013/10/09 Javascript
Javascript中的高阶函数介绍
2015/03/15 Javascript
Angular4实现动态添加删除表单输入框功能
2017/08/11 Javascript
JS设计模式之惰性模式(二)
2017/09/29 Javascript
node.js多个异步过程中判断执行是否完成的解决方案
2017/12/10 Javascript
JS中通过url动态获取图片大小的方法小结(两种方法)
2018/10/31 Javascript
vue在index.html中引入静态文件不生效问题及解决方法
2019/04/29 Javascript
JS实现星星海特效
2019/12/24 Javascript
JS数组方法reverse()用法实例分析
2020/01/18 Javascript
jQuery+ajax实现用户登录验证
2020/09/13 jQuery
[49:21]2018DOTA2亚洲邀请赛3月30日 小组赛B组 Effect VS iG
2018/03/31 DOTA
python线程、进程和协程详解
2016/07/19 Python
Python爬取网易云音乐热门评论
2017/03/31 Python
python opencv之SURF算法示例
2018/02/24 Python
解决Python安装时报缺少DLL问题【两种解决方法】
2019/07/15 Python
通过python改变图片特定区域的颜色详解
2019/07/15 Python
Django密码系统实现过程详解
2019/07/19 Python
Python3.6+selenium2.53.6自动化测试_读取excel文件的方法
2019/09/06 Python
详解python中*号的用法
2019/10/21 Python
解决pycharm中opencv-python导入cv2后无法自动补全的问题(不用作任何文件上的修改)
2020/03/05 Python
Python基于进程池实现多进程过程解析
2020/04/30 Python
HTML5全屏(Fullscreen)API详细介绍
2015/04/24 HTML / CSS
Onzie官网:美国时尚瑜伽品牌
2019/08/21 全球购物
文员岗位职责
2013/11/09 职场文书
初婚初育证明
2014/01/14 职场文书
大学生职业生涯规划书模板
2014/01/18 职场文书
委托书的样本
2015/01/28 职场文书
导游词之桂林
2019/08/20 职场文书
如何利用Python实现n*n螺旋矩阵
2022/01/18 Python