js根据服务端返回的时间倒计时
使用服务端与本地的时间差进行计算
$(function(){
// 倒计时
var _ordertimer = null;
var data =new Date();
var txt = $('.js_time_txt');
var buyTime = '2018/03/28 10:30:00'; //开抢时间
var nowTime = '2018/03/16 17:00:00'; //接口返回当前时间
var dateDiff = new Date(nowTime) - new Date(getnow()); //请求时间戳与本地时间戳
if(dateDiff < 0 ){
dateDiff = Math.abs(dateDiff);
}
if(new Date(nowTime) > new Date(buyTime)){
$('.time-range').hide(); //已开枪
return;
} else{
leftTimer(buyTime);
_ordertimer = setInterval(function(){leftTimer(buyTime)}, 1000);
}
// 获取当前时间 xxxx/xx/xx 00:00:00
function getnow(){
var year = data.getFullYear();
var month = parseInt(data.getMonth()+1) >= 10 ? parseInt(data.getMonth()+1) : '0' + parseInt(data.getMonth()+1);
var day = data.getDate();
var hours = data.getHours();
var minutes = data.getMinutes();
var seconds = data.getSeconds();
var now = year +'/'+ month +'/'+ day +' '+ hours +':'+ minutes +':'+ seconds;
return now;
}
function leftTimer(enddate) {
var leftTime = (new Date(enddate)) - new Date + dateDiff;
var days = parseInt(leftTime / 1000 / 60 / 60 / 24, 10); //计算剩余的天数
var hours = parseInt(leftTime / 1000 / 60 / 60 % 24, 10); //计算剩余的小时
var minutes = parseInt(leftTime / 1000 / 60 % 60, 10);//计算剩余的分钟
var seconds = parseInt(leftTime / 1000 % 60, 10);//计算剩余的秒数
days = checkTime(days);
hours = checkTime(hours);
minutes = checkTime(minutes);
seconds = checkTime(seconds);
if (days >= 0 || hours >= 0 || minutes >= 0 || seconds >= 0)
txt.html(days + "天" + hours + "小时" + minutes + "分" + seconds + "秒");
if (days <= 0 && hours <= 0 && minutes <= 0 && seconds <= 0) {
window.clearInterval(_ordertimer);
_ordertimer = null;
}
}
function checkTime(i) { //将0-9的数字前面加上0,例1变为01
if (i < 10) {
i = "0" + i;
}
return i;
}
})
js根据服务端返回的时间倒计时的更多相关文章
- js插件---WebUploader 如何接收服务端返回的数据
js插件---WebUploader 如何接收服务端返回的数据 一.总结 一句话总结: uploadSuccess有两个参数,一个是file(上传的文件信息),一个是response(服务器返回的信息 ...
- 服务端返回可执行js格式要求
服务端返回的数据,如果有直接执行的代码,那返回的头部格式中的"Content-Type",不能为"text/plain",不然,浏览器是不会执行返回数据的. 返 ...
- 如何创建一个客户端回调:js获得服务端的内容?
答案:表面上看去就是前端的js调用服务的C#方法,本质就是ajax,通过XMLHttpRequest对象和服务端进行交互.回调:就说回过头来调用,按理说js是一种脚本语言,怎么能用来调用服务端的呢?就 ...
- Vue 爬坑之路(十一)—— 基于 Nuxt.js 实现服务端渲染(SSR)
直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 ...
- 使用DWR实现JS调用服务端Java代码
DWR简介 DWR全称Direct Web Remoting,是一款非常优秀的远程过程调用(Remote Procedure Call)框架,通过浏览器提供的Ajax引擎实现在前端页面的JS代码中调用 ...
- next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序
前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...
- Nuxt.js vue服务端渲染
一.为什么要用Nuxt.js 原因其实不用多说,就是利用Nuxt.js的服务端渲染能力来解决Vue项目的SEO问题. 二.Nuxt.js和纯Vue项目的简单对比 1. build后目标产物不同 vue ...
- 在Android中调用KSOAP2库访问webservice服务出现的服务端返回AnyType{}
最近在做毕业设计的时候,涉及到了安卓端访问web service服务端数据库,并返回一个值,当我把web service测试通过后,想写一个简单的安卓测试程序,来实现服务端数据库访问,通过web se ...
- fastjson解析服务端返回的数据
1.配置依赖 //fastjson api 'com.alibaba:fastjson:1.2.44' 2.设计服务端返回的数据 {},{},{}]} 3.编写bean类,特别注意,要和服务端返回的类 ...
随机推荐
- jQuery AJAX 方法 success()后台传来的4种数据
JAVA中的四种JSON解析方式详解 jQuery AJAX 方法 success()后台传来的4种数据 1.后台返回一个页面 js代码 /**(1)用$("#content-wrapper ...
- Java的三大特性
一.封装性 含义:对外不可见,保护属性和方法不被外部多看见 实现:通过关键字private声明,用get.set方法为外部访问. 引用的传递: static关键字:修饰属性(全局属性):修饰方法(直接 ...
- main 及Scanner
通过main方法的args数组可以从控制台获取一组字符串数据. 1.Scanner类用于扫描从控制台输入的数据,可以接收字符串和基本数据类型的数据. 2.Scanner类位于java.util.Sca ...
- webhook: requestbin
A Runscope Community Project — Learn more. RequestBin Bin URL Make a request to get started. After m ...
- 023_supervisorctl管理服务注意事项
一. (1)问题 我在线上使用supervisorctl管理服务时遇到程序文件更新了,但是下次supervisorctl执行的时候并没有更新, 原因是supervisor更新后必须重新读取加载文件才行 ...
- ES--08
71.内核原理探秘_最后优化写入流程实现海量磁盘文件合并(segment merge,optimize) 课程大纲 每秒一个segment file,文件过多,而且每次search都要搜索所有的seg ...
- 【算法】【python实现】二叉树深度、广度优先遍历
二叉树的遍历,分为深度优先遍历,以及广度优先遍历. 在深度优先遍历中,具体分为如下三种: 先序遍历:先访问根节点,再遍历左子树,再遍历右子树: 中序遍历:先遍历左子树,再访问根节点,再遍历右子树: 后 ...
- 使用Python正则表达式自己实现解析URL各参数
不使用库,自己可以利用正则表达式实现解析域名各部分参数:协议.域名.端口.路径.载荷等. 使用的正则表达式如下: r'''(?x)\A ([a-z][a-z0-9+\-.]*):// # Scheme ...
- H - 栀子花开
这是一个栀子花开的季节,也是一个离别的季节,四年一千多个日日夜夜,那校园的角角落落,留下了我们沉思的身影:那上百次的成绩排名表,印证了我们深深浅浅不断进步的轨迹,但是这些进步都离不开老师的谆谆教诲. ...
- Ubuntu-linux云服务器下安装开启虚拟环境失败解决办法
为什么要安装虚拟环境? 1.某些项目需要安装旧的包,开发相应功能 2.项目开发时,安装部分环境不希望影响整机环境 如何安装? 首先安装python 安装pip工具 sudo apt-get insta ...