javascript 实现'秒杀,团购'倒计时展示的记录
<!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" lang="zh-CN">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta content="all" name="robots" />
<meta name="author" content="" />
<script language="javascript" src="http://test.e.house.163.com/product/js/jquery.js"></script>
</head>
<body>
.
距活动开始还有:<span id="sk_time"></span> <!-- 这个是倒计时的显示-->
.
<br/>
<span id="wyz">
<span class="btn_02"> 参加秒杀!!! </span> <!-- 这个是秒杀按钮,倒计时为0时会变成可以秒杀的样式-->
</span>
.
<script type="text/javascript">
var msbegintime = "1323446400000"; //这个是活动开始的时间戳
var msendtime = "1325174400000"; //这个是活动结束的时间戳
jQuery(document).ready(function() {
callBackServerTime("sk_time", "wyz", msbegintime, msendtime);
});
//_showtimediv:时间显示区域,_showqdiv:状态显示区域
//这个向服务器发送一个ajax请求,服务器返回服务器当前的时间戳,也就是xmlobj.responseText是一个服务器的时间戳
function callBackServerTime(_showtimediv, _showqdiv, _ms_begintime, _ms_endtime) {
var now = new Date();
var urlstr = "random=" + Math.round(Math.random() * 10000000);
var ajaxobj = new AJAXRequest; // 创建AJAX对象
ajaxobj.method = "GET"; // 设置请求方式为GET
ajaxobj.url = "/gz/source/getServerTime.do?" + urlstr; //注意ajax的跨域问题
ajaxobj.callback = function(xmlobj) {
//ShowQTime(xmlobj.responseText, _showtimediv, _showqdiv, _ms_begintime, _ms_endtime, _tryid,sourceid);
ShowQTime("1323158067288", _showtimediv, _showqdiv, _ms_begintime, _ms_endtime, _tryid,sourceid); // 这里使用静态数字替代xmlobj.responseText 方便测试
}
ajaxobj.send(); // 发送请求
}
//动态显示”秒杀“时间函数
function ShowQTime(_showtimediv, _showqdiv, _nowtime, _ms_begintime, _ms_endtime) {
_nowtime = Number(_nowtime);
var timmer = Math.floor((_ms_endtime - _nowtime) / (1000));
if (_nowtime >= _ms_begintime && timmer > 0) {;
//秒杀进行中
document.getElementById(_showtimediv).innerHTML = "<span class='pim_time'>0</span>天<span class='pim_time'>0</span>小时<span class='pim_time'>0</span>分钟<span class='pim_time'>0</span>秒";
document.getElementById(_showqdiv).innerHTML = "<span class='btn_01'><a href='/gz/sk/v/'> 秒杀开始了!!! </a></span>";
} else {
//秒杀倒计时
var nMS = _ms_begintime - _nowtime; //计算出开始时间和现在时间的时间戳差
var nD = Math.floor(nMS / (1000 * 60 * 60 * 24));
var nH = Math.floor(nMS / (1000 * 60 * 60)) % 24;
var nM = Math.floor(nMS / (1000 * 60)) % 60;
var nS = Math.floor(nMS / 1000) % 60;
var nMS = Math.floor(nMS / 100) % 10;
if (nD >= 0) {
var _timestr = "";
var snd = nD.toString();
if (snd.length == 1) {
snd = "0" + snd;
}
_timestr += "<span class='pim_time'>" + snd.substring(0, 1) + snd.substring(1, 2) +"</span>天";
var snH = nH.toString();
if (snH.length == 1) {
snH = "0" + snH;
}
_timestr += "<span class='pim_time'>" + snH.substring(0, 1) + snH.substring(1, 2) +"</span>小时";
var snM = nM.toString();
if (snM.length == 1) {
snM = "0" + snM;
}
_timestr += "<span class='pim_time'>" + snM.substring(0, 1) + snM.substring(1, 2) +"</span>分钟";
var snS = nS.toString();
if (snS.length == 1) {
&
补充:web前端 , JavaScript ,
上一个:使用JQuery 实现类似购物商城的购物车
下一个:二级联动js脚本
- 更多JAVA疑问解答:
- java怎么在线读取ftp服务器上的文件内容
- 关于程序员的职业规划
- HTML和JSP矛盾吗?
- java小程序如何打包?
- java怎么split路径文件名?
- jsp+javaBean中Column 'ordersPrice' specified twice的错误
- Java TCP/IP Socket网络编程系列
- 大家来讨论一下我到底该用什么好?Swing 还是 JavaFX
- 关于Hibernate实体自身多对一的抓取问题
- 关于apache2+tomcat群集出现的问题
- spring 获取上下文问题
- SSH 导入导出excel 谁有这块的资料吗?
- Ext TreePanel 刷新问题
- springmvc 加载一个jsp页面执行多个方法 报404
- checkbox数组action怎么向页面传值