效果:
插件代码:
$(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>