使用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 相关文章推荐
jQuery学习笔记之jQuery的DOM操作
Dec 22 Javascript
js 输出内容到新窗口具体实现代码
May 31 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
Jun 10 Javascript
JS随机洗牌算法之数组随机排序
Mar 23 Javascript
JS清除字符串中重复值的实现方法
Aug 03 Javascript
Angular2库初探
Mar 01 Javascript
ES6新特性五:Set与Map的数据结构实例分析
Apr 21 Javascript
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
vue2.0的虚拟DOM渲染思路分析
Aug 09 Javascript
Element input树型下拉框的实现代码
Dec 21 Javascript
react组件从搭建脚手架到在npm发布的步骤实现
Jan 09 Javascript
如何进行微信公众号开发的本地调试的方法
Jun 16 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
javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome)
2013/12/17 Javascript
jQuery的ready方法详解
2014/11/27 Javascript
浅谈JS日期(Date)处理函数
2014/12/07 Javascript
jQuery使用toggleClass方法动态添加删除Class样式的方法
2015/03/26 Javascript
小心!AngularJS结合RequireJS做文件合并压缩的那些坑
2016/01/09 Javascript
jquery zTree异步加载简单实例讲解
2016/02/25 Javascript
javascript 将共享属性迁移到原型中去的实现方法
2016/08/31 Javascript
JavaScript创建对象的七种方式(推荐)
2017/06/26 Javascript
Vue.js 2.0和Cordova开发webApp环境搭建方法
2018/02/26 Javascript
ES6关于Promise的用法详解
2018/05/07 Javascript
修改vue源码实现动态路由缓存的方法
2020/01/21 Javascript
VUE使用axios调用后台API接口的方法
2020/08/03 Javascript
Python中字典和JSON互转操作实例
2015/01/19 Python
Python2.x版本中maketrans()方法的使用介绍
2015/05/19 Python
使用Python读写及压缩和解压缩文件的示例
2016/07/08 Python
批量获取及验证HTTP代理的Python脚本
2017/04/23 Python
《Python学习手册》学习总结
2018/01/17 Python
Python读取word文本操作详解
2018/01/22 Python
解决nohup执行python程序log文件写入不及时的问题
2019/01/14 Python
pandas条件组合筛选和按范围筛选的示例代码
2019/08/26 Python
Python3运算符常见用法分析
2020/02/14 Python
Python如何实现FTP功能
2020/05/28 Python
深入浅析Python代码规范性检测
2020/07/31 Python
python eventlet绿化和patch原理
2020/11/21 Python
python爬虫如何解决图片验证码
2021/02/14 Python
办公室文秘自我评价
2013/09/21 职场文书
汽车技术服务与营销专业推荐信
2013/11/29 职场文书
《爱如茉莉》教后反思
2014/04/12 职场文书
2014年党的群众路线教育实践活动总结
2014/04/25 职场文书
社区文明倡议书
2015/04/28 职场文书
春季运动会加油词
2015/07/18 职场文书
党组织关系的介绍信模板
2019/06/21 职场文书
实习报告范文之电话客服岗位
2019/07/26 职场文书
python基于机器学习预测股票交易信号
2021/05/25 Python
简单谈谈Python面向对象的相关知识
2021/06/28 Python
MySQL修改默认引擎和字符集详情
2021/09/25 MySQL