jquery 显示*天*时*分*秒实现时间计时器


Posted in Javascript onMay 07, 2014

1.用jquery实现时间计时器,从之前的某个时间段到现在距离多少天多少时多少分多少秒?

html代码:

<div id="times_wrap" class="time_num"> 
距离现在时间: 
<div class="time_w"> 
<span id="time_d" class="time"> </span >天 
<span id="time_h" class="time"> </span >时 
<span id="time_m" class="time"> </span >分 
<span id="time_s" class="time"> </span >秒 
</div> 
</div> <script type="text/javascript"> 
$(function(){ 
show_time(); 
}); 
function show_time(){ 
var time_start = new Date("2013/10/01 00:00:00").getTime();//设定开始时间 
var time_end = new Date().getTime(); //设定结束时间(等于系统当前时间) 
//计算时间差 
var time_distance = time_end - time_start; 
if(time_distance > 0){ 
// 天时分秒换算 
var int_day = Math.floor(time_distance/86400000) 
time_distance -= int_day * 86400000; 
var int_hour = Math.floor(time_distance/3600000) 
time_distance -= int_hour * 3600000; 
var int_minute = Math.floor(time_distance/60000) 
time_distance -= int_minute * 60000; 
var int_second = Math.floor(time_distance/1000) 
// 时分秒为单数时、前面加零 
if(int_day < 10){ 
int_day = "0" + int_day; 
} 
if(int_hour < 10){ 
int_hour = "0" + int_hour; 
} 
if(int_minute < 10){ 
int_minute = "0" + int_minute; 
} 
if(int_second < 10){ 
int_second = "0" + int_second; 
} 
// 显示时间 
$("#time_d").html(int_day); 
$("#time_h").html(int_hour); 
$("#time_m").html(int_minute); 
$("#time_s").html(int_second); 
setTimeout("show_time()",1000); 
}else{ 
$("#time_d").html('00'); 
$("#time_h").html('00'); 
$("#time_m").html('00'); 
$("#time_s").html('00'); 
} 
} 
</script>
Javascript 相关文章推荐
JQUERY操作JSON实例代码
Feb 09 Javascript
jquery ui resizable bug解决方法
Oct 26 Javascript
js单独获取一个checkbox看其是否被选中
Sep 22 Javascript
jQuery中attr()方法用法实例
Jan 05 Javascript
jQuery实现文本框输入同步的方法
Jun 20 Javascript
JS与jQuery遍历Table所有单元格内容的方法
Dec 07 Javascript
jQuery图片切换动画特效
Nov 02 Javascript
jQuery选择器之属性过滤选择器详解
Sep 28 jQuery
微信小程序日历弹窗选择器代码实例
May 09 Javascript
详解无限滚动插件vue-infinite-scroll源码解析
May 12 Javascript
JS中==、===你分清楚了吗
Mar 04 Javascript
使用jquery实现轮播图效果
Jan 02 jQuery
解决jQuery动态获取手机屏幕高和宽的问题
May 07 #Javascript
addEventListener 的用法示例介绍
May 07 #Javascript
jquery通过select列表选择框对表格数据进行过滤示例
May 07 #Javascript
关闭时刷新父窗口两种方法
May 07 #Javascript
js获取下拉列表的值和元素个数示例
May 07 #Javascript
动态加载iframe时get请求传递中文参数乱码解决方法
May 07 #Javascript
table行随鼠标移动变色示例
May 07 #Javascript
You might like
PHP无限分类(树形类)的深入分析
2013/06/02 PHP
PHP判断变量是否为0的方法
2014/02/08 PHP
3个PHP多维数组转为一维数组的方法实例
2014/03/13 PHP
PHP模块化安装教程
2016/06/01 PHP
微信支付开发维权通知实例
2016/07/12 PHP
php+jQuery递归调用POST循环请求示例
2016/10/14 PHP
laravel框架中间件简单使用方法示例
2020/01/25 PHP
JQuery的Validation插件中Remote验证的中文问题
2010/07/26 Javascript
JQuery插件fancybox无法在弹出层使用左右键的解决办法
2013/12/25 Javascript
jQuery(js)获取文字宽度(显示长度)示例代码
2013/12/31 Javascript
JavaScript通过正则表达式实现表单验证电话号码
2014/03/07 Javascript
Javascript中For In语句用法实例
2015/05/14 Javascript
js实现创建删除html元素小结
2015/09/30 Javascript
JavaScript实现cookie的写入、读取、删除功能
2015/11/05 Javascript
jQuery Mobile操作HTML5的常用函数总结
2016/05/17 Javascript
Javascript如何判断数据类型和数组类型
2016/06/22 Javascript
bootstrap模态框消失问题的解决方法
2016/12/02 Javascript
Javascript实现一个简单的输入关键字添加标签效果实例
2017/06/01 Javascript
JS库particles.js创建超炫背景粒子插件(附源码下载)
2017/09/13 Javascript
vue-cli中使用高德地图的方法示例
2019/03/28 Javascript
vue使用echarts画组织结构图
2021/02/06 Vue.js
[03:40]DOTA2亚洲邀请赛小组赛第二日 赛事回顾
2015/01/31 DOTA
[02:51]2018年度DOTA2最佳中单位选手-完美盛典
2018/12/17 DOTA
python通过scapy获取局域网所有主机mac地址示例
2014/05/04 Python
python实现通过shelve修改对象实例
2014/09/26 Python
Python实现检测服务器是否可以ping通的2种方法
2015/01/01 Python
Python简单计算给定某一年的某一天是星期几示例
2018/06/27 Python
python opencv进行图像拼接
2020/03/27 Python
python对接ihuyi实现短信验证码发送
2020/05/10 Python
同程旅游英文网站:LY.com
2018/11/13 全球购物
Love, Bonito国际官网:新加坡女装品牌
2021/03/13 全球购物
村庄绿化方案
2014/05/07 职场文书
家长学校教学计划
2015/01/19 职场文书
迁徙的鸟观后感
2015/06/09 职场文书
2016年端午节校园广播稿
2015/12/18 职场文书
MySQL池化框架学习接池自定义
2022/07/23 MySQL