在静态页面精确的实现团购倒计时的javascript
倒计时思路：
在静态页面要实时的显示最新的团购商品，我们必须要用javascript来跟服务器进行沟通，首先是在页面加载完成后执行ajax事件，来读取最新的团购信息，读取的时候，要提出来团购还剩下多少秒结束，提出来之后，根据本地秒数的变化来对提取出来总倒计时秒数进行相减，就可以得到团购商品的剩余时间了！
好处：
团购商品，每次只需要读取一次数据库，而且可以精确的控制倒计时的剩余时间，而且还可以随时的提取最新的团购商品而无需重新生成静态页面！
具体的代码及操作流程：
1.首先来用jquery添加一个页面加载的事件：
$(document).ready(function(){$.ajax({type:"POST",url:"ajax的动态页面的处理地址",success:function(msg){在此处可以将读出来的内容添加到团购容器中}});})
2.加载完团购容器之后，用来读取具体的团购商品列表，并且提取出来每个商品剩余的时间来！
1 function getajaxload()
2 {
3 var tag=false;
4 for(var m=0;m<4;m++)
5 {
6
7 if($('#overtuan'+m).length>0)
8 {
9 tag=true; PrintValue('overtuan'+m,$('#overtuan'+m).attr('name'));
10 }
11 }
12
13 if(tag)
14 {
15 return;
16 }
17
18 var timenow=new Date().getTime();
19 var passnow= (timenow-datestarttime)/1000;
20 if(passnow<50)
21 {
22 setTimeout("getajaxload()",3000);
23 }
24
25 }
2 {
3 var tag=false;
4 for(var m=0;m<4;m++)
5 {
6
7 if($('#overtuan'+m).length>0)
8 {
9 tag=true; PrintValue('overtuan'+m,$('#overtuan'+m).attr('name'));
10 }
11 }
12
13 if(tag)
14 {
15 return;
16 }
17
18 var timenow=new Date().getTime();
19 var passnow= (timenow-datestarttime)/1000;
20 if(passnow<50)
21 {
22 setTimeout("getajaxload()",3000);
23 }
24
25 }
3.具体执行倒计时的方法：
1 var sh;
2 var datestarttime=new Date().getTime();
3 var passsecond=0;
4 function PrintValue(varid,vartoal)
5 {
6 var timenow=new Date().getTime();
7 if((passsecond-(timenow-datestarttime)/1000)<-10||(passsecond-(timenow-datestarttime)/1000)>10)
8 {location.reload();}
9 passsecond= (timenow-datestarttime)/1000;
10 if(passsecond>vartoal)
11 {
12 location.reload();
13 return;
14 }
15 else
16 {
17 document.getElementById(varid).innerHTML=getPrintString(vartoal-passsecond);
18 }
19 sh=setTimeout('PrintValue(\''+varid+'\','+vartoal+')',1000);
20 }
21 function getPrintString(totals)
22 {
23 var _hour=parseInt(totals/3600);
24
25 var _mim=parseInt((totals-parseInt(totals/3600)*3600)/60);
26
27 var _secd=parseInt(totals-parseInt(totals/60)*60);
28 return "<p class=\"notice\"> 距团购结束仅剩：<em>"+_hour+"</em>时<em>"+_mim+"</em>分<em>"+_secd+"</em>秒</p>";
29 }
2 var datestarttime=new Date().getTime();
3 var passsecond=0;
4 function PrintValue(varid,vartoal)
5 {
6 var timenow=new Date().getTime();
7 if((passsecond-(timenow-datestarttime)/1000)<-10||(passsecond-(timenow-datestarttime)/1000)>10)
8 {location.reload();}
9 passsecond= (timenow-datestarttime)/1000;
10 if(passsecond>vartoal)
11 {
12 location.reload();
13 return;
14 }
15 else
16 {
17 document.getElementById(varid).innerHTML=getPrintString(vartoal-passsecond);
18 }
19 sh=setTimeout('PrintValue(\''+varid+'\','+vartoal+')',1000);
20 }
21 function getPrintString(totals)
22 {
23 var _hour=parseInt(totals/3600);
24
25 var _mim=parseInt((totals-parseInt(totals/3600)*3600)/60);
26
27 var _secd=parseInt(totals-parseInt(totals/60)*60);
28 return "<p class=\"notice\"> 距团购结束仅剩：<em>"+_hour+"</em>时<em>"+_mim+"</em>分<em>"+_secd+"</em>秒</p>";
29 }
到此，整个过程就可以实现效果了，上面有几个注意事项是需要注意一下的！
1.里面有一个时间差的问题，如果程序设置的一秒变化一次的话，如果本地的时间差却大于或者小于10秒的话，那么就执行重新加载页面！
2.如果团购结束了，那么也重新加载页面，如果没有团购商品了，就暂停加载团购容器！
这个是我自己写着自己用的东西，分享出来给大家，希望大家可以用得到！
具体的实现效果大家可以参考：http://www.56fuyuan.com/ 大家点击查看源码，就可以看到整个实现流程和代码了，也可以看到实际效果了！