JS实现的仿淘宝交易倒计时效果


Posted in Javascript onNovember 27, 2015

本文实例讲述了JS实现的仿淘宝交易倒计时效果。分享给大家供大家参考,具体如下:

<script type="text/javascript">
var StartTime = new Date("2015/11/11 12:34:03");
document.write("订购时间: " + StartTime.toLocaleDateString() + StartTime.toLocaleTimeString() + "<br/>");
var CurrentTime = new Date();
document.write("当前时间: " + CurrentTime.toLocaleDateString() + CurrentTime.toLocaleTimeString() + "<br/>");
var EndTime=StartTime.getTime() + 15*24*60*60*1000;//约定订购时间15天后关闭交易
EndTime = new Date(EndTime);
document.write("结束时间: " + EndTime.toLocaleDateString() + EndTime.toLocaleTimeString() + "<br/>");
var TempTime = StartTime;
var nMS,nD,nH,nM,nS;
function ShowCloseTime(){  
  var oDate = new Date();
  nMS=EndTime-oDate ;  
  nD=Math.floor(nMS/(1000*60*60*24));
  nH=Math.floor(nMS/(1000*60*60)) % 24 ;
  nM=Math.floor(nMS/(1000*60)) % 60;
  nS=Math.floor(nMS/1000) % 60;  
  document.getElementById("CloseTime").innerHTML = ("您还有" + nD + "天" + nH + "小时" + nM + "分" + nS + "秒完成交易");
  if (nS<0 || nM<0 || nH<0 || nD<0)
  {
    document.getElementById("CloseTime").innerHTML = "交易因超过15天,已被系统自动关闭"
    clearInterval(CloseTimer);
  }
}
var CloseTimer = window.setInterval("ShowCloseTime()",1000) 
</script>
<div id="CloseTime"></div>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JQuery浮动DIV提示信息并自动隐藏的代码
Aug 29 Javascript
jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法
Aug 25 Javascript
AngularJS实现动态编译添加到dom中的方法
Nov 04 Javascript
Android中Okhttp3实现上传多张图片同时传递参数
Feb 18 Javascript
js遍历json对象所有key及根据动态key获取值的方法(必看)
Mar 09 Javascript
Vue.js实战之Vuex的入门教程
Apr 01 Javascript
使用Bootstrap和Vue实现用户信息的编辑删除功能
Oct 25 Javascript
使用ThinkJs搭建微信中控服务的实现方法
Aug 08 Javascript
jQuery设置下拉框显示与隐藏效果的方法分析
Sep 15 jQuery
Centos7 安装Node.js10以上版本的方法步骤
Oct 15 Javascript
vue-router的钩子函数用法实例分析
Oct 26 Javascript
微信小程序实现页面左右滑动
Nov 16 Javascript
谈谈jQuery Ajax用法详解
Nov 27 #Javascript
JavaScript中使用sencha gridpanel 编辑单元格、改变单元格颜色
Nov 26 #Javascript
基于jquery实现全屏滚动效果
Nov 26 #Javascript
javascript给span标签赋值的方法
Nov 26 #Javascript
谈谈javascript中使用连等赋值操作带来的问题
Nov 26 #Javascript
jQuery实现的AJAX简单弹出层效果代码
Nov 26 #Javascript
js检测iframe是否加载完成的方法
Nov 26 #Javascript
You might like
替换php字符串中的单引号为双引号的方法
2017/02/16 PHP
javascript高亮效果的二种实现方法
2008/09/14 Javascript
JQuery AJAX提交中文乱码的解决方案
2010/07/02 Javascript
jquery中:input和input的区别分析
2011/07/13 Javascript
window.onload使用指南
2015/09/13 Javascript
JS判断是否长按某一键的方法
2016/03/02 Javascript
AngularJS基础 ng-keydown 指令简单示例
2016/08/02 Javascript
JavaScript类的写法
2016/09/17 Javascript
js css自定义分页效果
2017/02/24 Javascript
JS文件/图片从电脑里面拖拽到浏览器上传文件/图片
2017/03/08 Javascript
详解Node.js开发中的express-session
2017/05/19 Javascript
Mongoose中document与object的区别示例详解
2017/09/18 Javascript
JavaScript实现小球沿正弦曲线运动
2020/09/07 Javascript
Servlet返回的数据js解析2种方法
2019/12/12 Javascript
二种python发送邮件实例讲解(python发邮件附件可以使用email模块实现)
2013/12/03 Python
python中利用xml.dom模块解析xml的方法教程
2017/05/24 Python
从django的中间件直接返回请求的方法
2018/05/30 Python
使用11行Python代码盗取了室友的U盘内容
2018/10/23 Python
对python打乱数据集中X,y标签对的方法详解
2018/12/14 Python
基于python实现从尾到头打印链表
2019/11/02 Python
python文件读取失败怎么处理
2020/06/23 Python
详解Python模块化编程与装饰器
2021/01/16 Python
用python 绘制茎叶图和复合饼图
2021/02/26 Python
python SOCKET编程基础入门
2021/02/27 Python
CSS3颜色值RGBA与渐变色使用介绍
2020/03/06 HTML / CSS
必须要使用游标的SQL语句有那些
2012/05/07 面试题
高校教师岗位职责
2014/03/18 职场文书
后备干部推荐材料
2014/12/24 职场文书
护士求职自荐信范文
2015/03/04 职场文书
公司年会开场白
2015/06/01 职场文书
法律意见书范文
2015/06/04 职场文书
庆祝教师节主题班会
2015/08/17 职场文书
新店开业策划方案怎么书写?
2019/07/05 职场文书
《西游记》读后感(3篇)
2019/09/20 职场文书
教你使用pyinstaller打包Python教程
2021/05/27 Python
Redis安装使用RedisJSON模块的方法
2022/03/23 Redis