使用javascript做时间倒数读秒功能的实例


Posted in Javascript onJanuary 23, 2019

某个试卷在线考试需要读秒。网上找了一会就是没找到我想要的。只好自己改改网上的,这也用用,那也用用。

其他代码不贴了。贴相关的:

html页面代码:

<a class="btn btn-default" onclick="StartExamine();">开始</a> 
<div id="TimeClock" class="col-md-4" ><span class="text-danger hour">00</span> <span class="text-danger minute">00</span> <span class="text-danger seconds">00</span></div>

作为一个显示倒数的div层

javascript 代码:

var gEaminePapeId = 'dfdfad33434342';
    var gExaminePapeTime = '100';    
    var gHour = gExaminePapeTime / 60;    
    var gMinute = gExaminePapeTime % 60; 
    var gSeconds = gExaminePapeTime * 60;
    var hour_elem = $("#TimeClock").find('.hour');
    var minute_elem = $("#TimeClock").find('.minute');
    var second_elem = $("#TimeClock").find('.seconds');
    function StartExamine() { 
      //开始计时      
      var timeClik = setInterval('ShowClock()', 1000);
   }
   function ShowClock() {    
     if (gSeconds > 1) {
       gSeconds -= 1;
       var hour = Math.floor((gSeconds / 3600) % 24);
       var minute = Math.floor((gSeconds / 60) % 60);
       var second = Math.floor(gSeconds % 60);
       $(hour_elem).text(hour < 10 ? "0" + hour+":" : hour+":"); //计算小时
       $(minute_elem).text(minute < 10 ? "0" + minute+":" : minute+":"); //计算分钟
       $(second_elem).text(second < 10 ? "0" + second : second); //计算秒杀
     }
     else {
       clearInterval(timeClik);
       //做题时间到
        ForceSubmit();
     }
   }   
    function ForceSubmit() {
      //强制提交答题
  }

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
javascript闭包的理解和实例
Aug 12 Javascript
node.js中的buffer.Buffer.isEncoding方法使用说明
Dec 14 Javascript
鼠标事件的screenY,pageY,clientY,layerY,offsetY属性详解
Mar 12 Javascript
理解javascript异步编程
Jan 27 Javascript
bootstrap选项卡扩展功能详解
Jun 14 Javascript
Angular 2父子组件数据传递之@Input和@Output详解 (上)
Jul 05 Javascript
详解vue表单——小白速看
Apr 08 Javascript
微信小程序多音频播放进度条问题
Aug 28 Javascript
基于AngularJs select绑定数字类型的问题
Oct 08 Javascript
小程序实现单选多选功能
Nov 04 Javascript
jquery实现弹窗(系统提示框)效果
Dec 10 jQuery
express异步函数异常捕获示例详解
Nov 30 Javascript
大转盘抽奖小程序版 转盘抽奖网页版
Apr 16 #Javascript
javascript json字符串到json对象转义问题
Jan 22 #Javascript
使用JavaScript保存文本文件到本地的两种方法
Jan 22 #Javascript
微信小程序实现九宫格抽奖
Apr 15 #Javascript
200行HTML+JavaScript实现年会抽奖程序
Jan 22 #Javascript
微信小程序使用map组件实现获取定位城市天气或者指定城市天气数据功能
Jan 22 #Javascript
微信小程序使用map组件实现解析经纬度功能示例
Jan 22 #Javascript
You might like
php接口数据加密、解密、验证签名
2015/03/12 PHP
php将12小时制转换成24小时制的方法
2015/03/31 PHP
php类的扩展和继承用法实例
2015/06/20 PHP
php实现可运算的验证码
2015/11/10 PHP
PHP模版引擎原理、定义与用法实例
2019/03/29 PHP
获取页面高度,窗口高度,滚动条高度等参数值getPageSize,getPageScroll
2006/09/22 Javascript
使用EXT实现无刷新动态调用股票信息
2008/11/01 Javascript
Jquery cookie操作代码
2010/03/14 Javascript
JSON 数字排序多字段排序介绍
2013/09/18 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
node.js连接mongoDB数据库 快速搭建自己的web服务
2016/04/17 Javascript
JS动态生成年份和月份实例代码
2017/02/04 Javascript
vue mintui-Loadmore结合实现下拉刷新和上拉加载示例
2017/10/12 Javascript
JS运动特效之同时运动实现方法分析
2018/01/24 Javascript
在Vue项目中使用d3.js的实例代码
2018/05/01 Javascript
angularjs性能优化的方法
2018/09/05 Javascript
JavaScript实现省市区三级联动
2020/02/13 Javascript
Python中实现常量(Const)功能
2015/01/28 Python
Python编程之event对象的用法实例分析
2017/03/23 Python
Python实现简单的HttpServer服务器示例
2017/09/25 Python
Python多线程中阻塞(join)与锁(Lock)使用误区解析
2018/04/27 Python
python生成多个只含0,1元素的随机数组或列表的实例
2018/11/12 Python
对python中大文件的导入与导出方法详解
2018/12/28 Python
python statsmodel的使用
2020/12/21 Python
香港交友网站:be2香港
2018/07/22 全球购物
网络工程师面试(三木通信技术有限公司)
2013/06/05 面试题
自我推荐书
2013/12/04 职场文书
村级换届选举方案
2014/05/10 职场文书
环保公益策划方案
2014/08/15 职场文书
项目申请汇报材料
2014/08/16 职场文书
2014大学校园光棍节活动策划书
2014/09/29 职场文书
2015年药店店长工作总结
2015/04/29 职场文书
2015年干部教育培训工作总结
2015/05/15 职场文书
公司管理建议书
2015/09/14 职场文书
先进个人主要事迹怎么写
2015/11/04 职场文书
深入理解go缓存库freecache的使用
2022/02/15 Golang