正文直接开始
我们经常在网上看到那些商城里有限时抢购和秒杀一类的倒计时,今天我来分享一个用js获取服务器时然后做倒计时的程序,至于为什么要获取服务器时间我想大家都懂的!
<!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" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>untitled</title> <script type="text/javascript"> get=function (id){ return document.getElementById(id) } if(document.all){ window.XMLHttpRequest=function(){ var get=['Microsoft.XMLHTTP','Msxml2.XMLHTTP']; for(var i=0;i<get.length;i++) { try{ return new ActiveXObject(get[i]) } catch(e){} }; }; } webDate=function(fn){ var Htime=new XMLHttpRequest(); Htime.onreadystatechange=function(){ Htime.readyState==4&&(fn(new Date(Htime.getResponseHeader('Date')))) }; Htime.open('HEAD', '/?_='+(-new Date)); Htime.send(null); } window.time=new Date(); targetTime=new Date(); time2String=function (t){ with(t)return [getFullYear(),'年' ,('0'+(getMonth()+1)).slice(-2),'月' ,('0'+getDate()).slice(-2),'日 ' ,('0'+getHours()).slice(-2),': ' ,('0'+getMinutes()).slice(-2),': ' ,('0'+getSeconds()).slice(-2)].join('') } int2time=function (m){ m-=(D=parseInt(m/86400000))*86400000; m-=(H=parseInt(m/3600000))*3600000; S=parseInt((m-=(M=parseInt(m/60000))*60000)/1000); return D+'天'+H+'小时'+M+'分'+S+'秒' } setInterval(function (){ webDate(function (webTime){ get('web').innerHTML=time2String(time=webTime); }) get('locale').innerHTML=time2String(new Date); get('time').innerHTML=int2time(targetTime-time); if ((targetTime-time)<0) { get('time').innerHTML = 'Game Over'; } },1000) </script> </head> <body>
设定时间:2012年12月31日0时0分0秒
服务器时间:<span id='web'>loading...</span>
本地时间:<span id="locale">loading...</span>
倒计时时间:<span id="time">loading...</span>
<script type="text/javascript" charset="utf-8"> targetTime=new Date(2012,12,31,00,00,00); </script>
原理其实也是很简单的,用xmlhttp来获取服务器上的时间,后台用js做倒计时显示到页面上,这个在本地运行不一定能成功,最好是在服务器上运行!
使用过程中遇到什么问题,大家都可以在这里跟我咨询!
转载请注明:Rockyxia Web技术博客 » 分享一个js获取服务器时间,然后做倒计时的程序
感谢阅读,如果您发现文章中有表述不准确,欢迎提出来,也欢迎交流相关问题,你可以去这里进行一对一问答交流。