javascript 实现秒杀,团购倒计时展示的记录-javascript-IT落伍者

这篇文章介绍了javascript 实现秒杀团购倒计时展示的记录方法有需要的朋友可以参考一下

最近做了一个房产的秒杀团购的电子商务网站(房子也有秒杀出手不小啊)其中里面有一个秒杀的倒计时展示主要是判断当前时间距离秒杀开始还有多少时间还有秒杀开始和秒杀结束的各种展示
其中最主要的一点就是所谓的当前时间不能使用浏览器通过new Date()获取的客户端时间这样只要用户修改了自己的机器时间那么倒计时就会乱透了所以这个当前时间必须使用的是服务器时间所以采用的是静态缓存页面所以这个当前时间使用ajax方式进行获取

复制代码代码如下:

<!DOCTYPE html PUBLIC "//WC//DTD XHTML Transitional//EN" "
<html xmlns="
<head>
<title></title>
<meta httpequiv="ContentType" content="text/html; charset=gb" />
<meta httpequiv="ContentLanguage" content="zhCN" />
<meta httpequiv="XUACompatible" content="IE=EmulateIE" />
<meta content="all" name="robots" />
<meta name="author" content="" />
</head>
<body onload=start()>

距活动开始还有 <! 这个是倒计时的显示 >

 

参加秒杀！！！ <! 这个是秒杀按钮倒计时为时会变成可以秒杀的样式 >


<script type="text/javascript">
var msbegintime = ""; //这个是活动开始的时间戳
var msendtime = ""; //这个是活动结束的时间戳
function start(){
callBackServerTime("sk_time" "wyz" msbegintime msendtime);
}
//_showtimediv:时间显示区域_showqdiv状态显示区域
//这个向服务器发送一个ajax请求服务器返回服务器当前的时间戳也就是xmlobjresponseText是一个服务器的时间戳
function callBackServerTime(_showtimediv _showqdiv _ms_begintime _ms_endtime) {
var now = new Date();
var urlstr = "random=" + Mathround(Mathrandom() * );
var ajaxobj = new AJAXRequest; // 创建AJAX对象
ajaxobjmethod = "GET"; // 设置请求方式为GET
ajaxobjurl = "/gz/source/getServerTimedo?" + urlstr; //注意ajax的跨域问题
ajaxobjcallback = function(xmlobj) {
//ShowQTime(xmlobjresponseText _showtimediv _showqdiv _ms_begintime _ms_endtime _tryidsourceid);
ShowQTime( _showtimediv _showqdiv"" _ms_begintime _ms_endtime); // 这里使用静态数字替代 xmlobjresponseText 方便测试
}
ajaxobjsend(); // 发送请求
}
//动态显示”秒杀“时间函数
function ShowQTime(_showtimediv _showqdiv _nowtime _ms_begintime _ms_endtime) {
_nowtime = Number(_nowtime);
var timmer = Mathfloor((_ms_endtime _nowtime) / ());
if (_nowtime >= _ms_begintime && timmer > ) {;
//秒杀进行中
documentgetElementById(_showtimediv)innerHTML = "天小时分钟秒";
documentgetElementById(_showqdiv)innerHTML = "<a >秒杀开始了！！！</a>";
} else {
//秒杀倒计时
var nMS = _ms_begintime _nowtime; //计算出开始时间和现在时间的时间戳差
var nD = Mathfloor(nMS / ( * * * ));
var nH = Mathfloor(nMS / ( * * )) % ;
var nM = Mathfloor(nMS / ( * )) % ;
var nS = Mathfloor(nMS / ) % ;
var nMS = Mathfloor(nMS / ) % ;
if (nD >= ) {
var _timestr = "";
var snd = nDtoString();
if (sndlength == ) {
snd = "" + snd;
}
_timestr += "" + sndsubstring( ) + sndsubstring( ) +"天";
var snH = nHtoString();
if (snHlength == ) {
snH = "" + snH;
}
_timestr += "" + snHsubstring( ) + snHsubstring( ) +"小时";
var snM = nMtoString();
if (snMlength == ) {
snM = "" + snM;
}
_timestr += "" + snMsubstring( ) + snMsubstring( ) +"分钟";
var snS = nStoString();
if (snSlength == ) {
snS = "" + snS;
}
_timestr += "" + snSsubstring( ) + snSsubstring( ) +"秒";
documentgetElementById(_showtimediv)innerHTML = _timestr;
}else {
//秒杀结束
documentgetElementById(_showtimediv)innerHTML = "天小时分钟秒";
documentgetElementById(_showqdiv)innerHTML = "<a >秒杀结束了！！！</a>";
}
}
//注意 (_nowtime + ) 增加秒
setTimeout("ShowQTime(" + _showtimediv + "" + _showqdiv + "" + (_nowtime + ) + "" + _ms_begintime + "" + _ms_endtime + ")" );
}
function AJAXRequest() {
var xmlObj = false;
var CBfuncObjSelf;
ObjSelf=this;
try { xmlObj=new XMLHttpRequest; }
catch(e) {
try { xmlObj=new ActiveXObject("MSXMLXMLHTTP"); }
catch(e) {
try { xmlObj=new ActiveXObject("MicrosoftXMLHTTP"); }
catch(e) { xmlObj=false; }
}
}
if (!xmlObj) return false;
thismethod="POST";
thisurl;
thisasync=true;
thiscontent="";
thiscallback=function(cbobj) {return;}
thissend=function() {
if(!thismethod||!thisurl||!thisasync) return false;
xmlObjopen (thismethod thisurl thisasync);
if(thismethod=="POST") xmlObjsetRequestHeader("ContentType""application/xwwwformurlencoded");
xmlObjonreadystatechange=function() {
if(xmlObjreadyState==) {
if(xmlObjstatus==) {
ObjSelfcallback(xmlObj);
}
}
}
if(thismethod=="POST") xmlObjsend(thiscontent);
else xmlObjsend(null);
}
}
</script>
</body>
</html>

javascript 实现 秒杀,团购 倒计时展示的记录

javascript 实现秒杀,团购倒计时展示的记录