<! DOCTYPE html>
< html >
< head >
< meta charset= "UTF-8" >
< title ></title >
< script src= "js/jquery-1.11.0.js" type ="text/javascript" charset = "utf-8"></ script >
< style type= "text/css" >
table { width: 500 px; margin : 100 px auto ;}
table tr { height: 30 px; }
table tr td{ padding-left : 15 px ;}
</ style>
< script type= "text/javascript" >
$( function(){
var tb = document .getElementById( "backtimeout" );
var tbrow = tb.rows.length;
var time;
function GetRTime( time , i){
var EndTime= new Date(time);
var NowTime = new Date();
var t = EndTime.getTime() - NowTime.getTime();
var d =Math.floor(t /1000/ 60/60/ 24 );
var h =Math.floor(t /1000/ 60/ 60 %24 );
var m =Math.floor(t /1000/ 60% 60 );
var s =Math.floor(t / 1000% 60 );
if (d< 10 ){
$( "#backtimeout tr").eq(i).find( ".time-d" ).html("0" + d + "天" );
} else {
$( "#backtimeout tr").eq(i).find( ".time-d" ).html(d + "天" );
}
if (h< 10 ){
$( "#backtimeout tr").eq(i).find( ".time-h" ).html("0" + h + "时" );
} else {
$( "#backtimeout tr").eq(i).find( ".time-h" ).html(h + "时" );
}
if (m< 10 ){
$( "#backtimeout tr").eq(i).find( ".time-m" ).html("0" + m + "分" );
} else {
$( "#backtimeout tr").eq(i).find( ".time-m" ).html(m + "分" );
}
if (s< 10 ){
$( "#backtimeout tr").eq(i).find( ".time-s" ).html("0" + s + "秒" );
} else {
$( "#backtimeout tr").eq(i).find( ".time-s" ).html(s + "秒" );
}
};
function backtime(){
for ( var i = 0;i < tbrow;i++ ){
time = $("#backtimeout tr").eq(i).find( ".backtime" ).html();
GetRTime(time,i);
};
};
setInterval(backtime, 0 );
})
</ script >
</ head >
< body >
< table border= "" cellspacing= "0" cellpadding = "0" id = "backtimeout" >
< tr >
< td >new projact</ td>
< td >
< span class ="backtime" >2016/06/22 13:00:00</ span >
</ td >
< td >
< span class= "time-d" >00天</span >
< span class= "time-h" >00时</span >
< span class= "time-m" >00分</span >
< span class= "time-s" >00秒</span >
</ td >
</ tr >
< tr >
< td >new projact</ td>
< td >
< span class ="backtime" >2016/07/20 16:00:10</ span >
</ td >
< td >
< span class= "time-d" >00天</span >
< span class= "time-h" >00时</span >
< span class= "time-m" >00分</span >
< span class= "time-s" >00秒</span >
</ td >
</ tr >
< tr >
< td >new projact</ td>
< td >
< span class ="backtime" >2016/08/20 15:20:50</ span >
</ td >
< td >
< span class= "time-d" >00天</span >
< span class= "time-h" >00时</span >
< span class= "time-m" >00分</span >
< span class= "time-s" >00秒</span >
</ td >
</ tr >
< tr >
< td >new projact</ td>
< td >
< span class ="backtime" >2016/05/30 18:00:20</ span >
</ td >
< td >
< span class= "time-d" >00天</span >
< span class= "time-h" >00时</span >
< span class= "time-m" >00分</span >
< span class= "time-s" >00秒</span >
</ td >
</ tr >
< tr >
< td >new projact</ td>
< td >
< span class ="backtime" >2016/06/05 08:00:16</ span >
</ td >
< td >
< span class= "time-d" >00天</span >
< span class= "time-h" >00时</span >
< span class= "time-m" >00分</span >
< span class= "time-s" >00秒</span >
</ td >
</ tr >
</ table >
</ body >
</ html >
js,jquery多个倒计时同步使用backtimeout
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 原文地址:http://www.oschina.net/code/snippet_2001568_48311特别说...
- 1、先是介绍现有方法 (1)基于小型手持式检查设备进行检测 文中就简单说了几句,意思就是拿着走,,, (2)基于多...