效果:
插件代码:
$(function(){ function jisuanTime_daojishi(){ $(".daojishi").each(function(){ var endtime = $(this).attr("daojishi_time"); endtime=new Date(endtime); var nowtime = new Date(); var leftsecond = parseInt((endtime.getTime()-nowtime.getTime())/1000); if(leftsecond<=0){ $(this).html("抢购已结束"); }else{ var date = parseInt(leftsecond/3600/24); var hour = parseInt((leftsecond/3600)%24); var miniute = parseInt((leftsecond/60)%60); var second = parseInt(leftsecond%60); $(this).html("剩余:"+date + "天" + hour + "小时" + miniute +"分" + second +"秒"); } }); } var sh = setInterval(jisuanTime_daojishi,1000); })
使用:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>抢购倒计时</title> <script type='text/javascript' src='jquery-1.8.1.js'></script> <script type='text/javascript' src='daojishi.js'></script> <style type="text/css"> td{width:250px;height:100px;} </style> </head> <body> <div> <table> <tr> <td><span class="daojishi" daojishi_time="2014/02/30,16:37:03">正在加载...</span></td> <td><span class="daojishi" daojishi_time="2014/02/07,12:32:30">正在加载...</span></td> <td><span class="daojishi" daojishi_time="2014/01/30,16:37:03">正在加载...</span></td> </tr> <tr> <td><span class="daojishi" daojishi_time="2014/01/30,16:37:03">正在加载...</span></td> <td><span class="daojishi" daojishi_time="2014/01/30,16:37:03">正在加载...</span></td> <td><span class="daojishi" daojishi_time="2014/01/30,16:37:03">正在加载...</span></td> </tr> </table> </div> </body> </html>