js编写简单的计时器功能


Posted in Javascript onJuly 15, 2017

本文实例为大家分享了js计时器功能的编写代码,供大家参考,具体内容如下

小白一枚,如有代码不规范或者写错的地方,希望得大神指导

js编写简单的计时器功能

代码:

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
</head>

<body>
<div id="waitTime"></div>

<script src="js/jquery-git.js"></script>
<script type="text/javascript">
//计时
var time = 0;
var a = setInterval(jishi, 1000); //1000毫秒
var isCanCancerOrder = false;

function jishi() {
time++;

$('#waitTime').html(calTime(time)); //倒计时

if(time == 60) { //1分钟之后
alert("一分钟到啦!");
}
}

function calTime(time) {
var spit = ":";
var hour = "00";
var second = "00";
var min = "00";
var result = "";

if(time % 60 != 0) { //秒
if(time % 60 > 10) {
second = time % 60;
} else {
second = "0" + time % 60;
}
}

if(parseInt(time / 60) != 0) { //分
if(parseInt(time / 60) > 10) {
min = parseInt(time / 60);
} else {
min = "0" + parseInt(time / 60);
}
}

if(parseInt(time / 3600) != 0) { //时
if(parseInt(time / 3600) > 10) {
hour = parseInt(time / 3600);
} else {
hour = "0" + parseInt(time / 3600);
}
}

result = hour + spit + min + spit + second;

return result;
}
</script>
</body>

</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
extjs fckeditor集成代码
May 10 Javascript
jquery scrollTop方法根据滚动像素显示隐藏顶部导航条
May 27 Javascript
js实现的GridView即表头固定表体有滚动条且可滚动
Feb 19 Javascript
jQuery中nextUntil()方法用法实例
Jan 07 Javascript
基于Vue.js实现简单搜索框
Mar 26 Javascript
详解Element 指令clickoutside源码分析
Feb 15 Javascript
Vuex新手的理解与使用详解
May 31 Javascript
解决layui表格的表头不滚动的问题
Sep 04 Javascript
Vue Extends 扩展选项用法完整实例
Sep 17 Javascript
JQuery事件冒泡和默认行为代码实例
May 13 jQuery
JS继承实现方法及优缺点详解
Sep 02 Javascript
分享几个JavaScript运算符的使用技巧
Apr 24 Javascript
深入理解angular2启动项目步骤
Jul 15 #Javascript
js+html5实现复制文字按钮
Jul 15 #Javascript
js+html5实现页面可刷新的倒计时效果
Jul 15 #Javascript
详解ES6之用let声明变量以及let loop机制
Jul 15 #Javascript
vue增删改查的简单操作
Jul 15 #Javascript
JavaScript实现跟随滚动缓冲运动广告框
Jul 15 #Javascript
Javascript实现基本运算器
Jul 15 #Javascript
You might like
繁体中文转换为简体中文的PHP函数
2006/10/09 PHP
php读取html并截取字符串的简单代码
2009/11/30 PHP
php用正则表达式匹配中文实例详解
2013/11/06 PHP
PHP实现UTF-8文件BOM自动检测与移除实例
2014/11/05 PHP
如何批量清理系统临时文件(语言:C#、 C/C++、 php 、python 、java )
2016/02/01 PHP
详解使用php-cs-fixer格式化代码
2020/09/16 PHP
jquery与google map api结合使用 控件,监听器
2010/03/04 Javascript
jquery实现非叠加式的搜索框提示效果
2014/01/07 Javascript
一个JavaScript去除字符串末尾的空白实例代码
2014/09/22 Javascript
微信中一些常用的js方法汇总
2015/03/12 Javascript
jquery实现最简单的滑动菜单效果代码
2015/09/12 Javascript
全面解析JavaScript的Backbone.js框架中的Router路由
2016/05/05 Javascript
用js实现放大镜的效果的简单实例
2016/05/23 Javascript
JavaScript中子对象访问父对象的方式详解
2016/09/01 Javascript
nodejs微信公众号支付开发
2016/09/19 NodeJs
超全面的javascript中变量命名规则
2017/02/09 Javascript
js正则表达式验证密码强度【推荐】
2017/03/03 Javascript
Vue props用法详解(小结)
2018/07/03 Javascript
如何在js代码中消灭for循环实例详解
2018/07/29 Javascript
简述Vue中容易被忽视的知识点
2019/12/09 Javascript
javascript实现画板功能
2020/04/12 Javascript
JavaScript代码模拟鼠标自动点击事件示例
2020/08/07 Javascript
[01:08:57]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS LGD第二场
2014/05/24 DOTA
[47:03]Ti4第二日主赛事败者组 LGD vs iG 2
2014/07/21 DOTA
Python实现解析Bit Torrent种子文件内容的方法
2017/08/29 Python
python调用Matplotlib绘制分布点并且添加标签
2018/05/31 Python
python连接打印机实现打印文档、图片、pdf文件等功能
2020/02/07 Python
Django模型验证器介绍与源码分析
2020/09/08 Python
台湾全方位线上课程与职能学习平台:TibaMe
2019/12/04 全球购物
个人工作总结范文2014
2014/11/07 职场文书
元宵节晚会主持词
2015/07/01 职场文书
检讨书怎么写?
2019/06/21 职场文书
pytorch 实现多个Dataloader同时训练
2021/05/29 Python
Python移位密码、仿射变换解密实例代码
2021/06/27 Python
python在package下继续嵌套一个package
2022/04/14 Python
Tomcat项目启动失败的原因和解决办法
2022/04/20 Servers