工作总结_js倒计时
最近在弄一个倒计时抽奖的项目,由于是每天的某个时间段所以,网上也没有找到自己合适的。就自己写了一个留下来以供参考。其中最值得注意的一点是不同种类型的手机对自定义的时间支持方式是不一样的。苹果时间只能支持/ 不支持- 安卓都可行。
下面是代码。
<script type="text/javascript"> var flg = true; //苹果时间只能支持/ 不支持-
var myDay = ["2016/02/24 10:00:00", "2016/02/24 11:00:00", "2016/02/24 12:00:00", "2016/02/24 14:00:00", "2016/02/24 15:00:00",
"2016/02/25 10:00:00", "2016/02/25 11:00:00", "2016/02/25 12:00:00", "2016/02/25 14:00:00", "2016/02/25 15:00:00",
"2016/02/26 10:00:00", "2016/02/26 11:00:00", "2016/02/26 12:00:00", "2016/02/26 14:00:00", "2016/02/26 15:00:00",
]; var hh = "";
var mm = "";
var ss = "";
var Day = ""; //开始时间
var starTime = "";
//持续时间
var continueTime = ;
//是否开始抽奖 默认不可以
var isStart = false;
var flg = true;
//第一次进入
var first = true;
//服务器时间
var ServerTime = "";
//S刷新时间
var RefreshTime = false;
//上一次刷新的时间
var UpTime = new Date().getTime();
var sTime = ""; window.onload = function () { $.ajax({
url: "/Handel/H_User.ashx?action=dataTime&t=" + new Date().getTime(),
type: "get",
success: function (data) {
if (data != "") {
ServerTime = data;
//第一次加载 ,防止中间的那一秒空缺
D_Time();
}
}
}); setTimeout(function () {
$.ajax({
url: "/Handel/H_User.ashx?action=dataTime&t=" + new Date().getTime(),
type: "get",
success: function (data) {
if (data != "") {
ServerTime = data;
setInterval("D_Time()", );
}
}
});
}, )
//防止时间黑屏造成的时间误差 $("body").bind("touchmove", function () {
if (new Date().getTime() - UpTime > * ) { if (flg == false) {
return;
}
flg = false;
$.ajax({
url: "/Handel/H_User.ashx?action=dataTime&t=" + new Date().getTime(),
type: "get",
success: function (data) { flg = true;
if (data != "") {
sTime = data;
UpTime = new Date().getTime();
RefreshTime = true;
D_Time();
}
}
});
}
}) function ChangeShowTime() { //累加服务器时间
ServerTime = new Date(ServerTime).getTime() + ;
$.each(eval(myDay), function (i, item) {
debugger
if (new Date(item).getDate() > new Date(ServerTime).getDate()) {
starTime = item;
return false;
} //当天
if (new Date(item).getDate() == new Date(ServerTime).getDate()) {
//大于当前小时
if (new Date(item).getHours() > new Date(ServerTime).getHours()) {
starTime = item;
return false;
}
//等于当前小时
else if (new Date(item).getHours() == new Date(ServerTime).getHours()) {
//3分钟内
if (new Date(ServerTime).getMinutes() <= continueTime) {
starTime = item;
isStart = true;
return false;
}
else {
isStart = false;
}
}
}
});
} function D_Time() {
if (RefreshTime == true) {
ServerTime = new Date(sTime);
RefreshTime = false;
}
ChangeShowTime();
// var myDate = new Date(ServerTime);
var leftTime = new Date(starTime).getTime() - ServerTime;
var leftsecond = parseInt(leftTime / );
var seconds = leftTime / ;
var minutes = Math.floor(leftsecond / );
var hours = Math.floor(minutes / );
var days = Math.floor(hours / );
var CDay = days;
var CHour = hours % + CDay * ;
var CMinute = minutes % ;
var CSecond = Math.floor(seconds % ); if (isStart == true) {
//3分钟之后
if (new Date(ServerTime).getMinutes() > continueTime) {
isStart = false;
}
$("#timer").empty();
$("#timer").append("<b>0<em></em></b><b>0<em></em></b> <span>小时</span> <b>0<em></em></b><b>0<em></em>"
+ "</b><span>分钟</span><b>0<em></em></b> <b>0<em></em></b><span>秒</span>");
} else {
if (CHour < ) {
hh = "<b>0<em></em></b><b>" + CHour + "<em></em></b><span>";
}
else {
hh = "<b>" + CHour.toString().substr(, ) + "<em></em></b><b>" + CHour.toString().substr(, ) + "<em></em></b><span>";
}
if (CMinute < ) {
mm = "</span><b>0<em></em></b><b>" + CMinute + "<em></em></b><span>";
}
else {
mm = "</span><b>" + CMinute.toString().substr(, ) + "<em></em></b><b>" + CMinute.toString().substr(, ) + "<em></em></b><span>";
}
if (CSecond < ) {
ss = "</span><b>0<em></em></b><b>" + CSecond + "<em></em></b> <span>";
}
else {
ss = "</span><b>" + CSecond.toString().substr(, ) + "<em></em></b><b>" + CSecond.toString().substr(, ) + "<em></em></b> <span>";
} $("#timer").empty();
$("#timer").append("" + hh + "小时" + mm + "分钟" + ss + "秒</span>");
} } </script>
工作总结_js倒计时的更多相关文章
- 工作总结_js
工作至今已经有7个月了,虽然有进步,但是总感觉还是什么都不知道.可能这其中很大一部分还是与自己有关系,遇到自己不知道,问了人,或者百度到了,但是自己没有用心记.平时要用的时候,打开上一个项目,复制粘贴 ...
- react native中的聊天气泡以及timer封装成的发送验证码倒计时
今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...
- 关于Java并发编程的总结和思考
编写优质的并发代码是一件难度极高的事情.Java语言从第一版本开始内置了对多线程的支持,这一点在当年是非常了不起的,但是当我们对并发编程有了更深刻的认识和更多的实践后,实现并发编程就有了更多的方案和更 ...
- 【转】关于Java并发编程的总结和思考
一.前言 就是想学习Java并发编程了,所以转载一下这篇认为还不错的博客~ 二.正文 编写优质的并发代码是一件难度极高的事情.Java语言从第一版本开始内置了对多线程的支持,这一点在当年是非常了不起的 ...
- 2020 倒计时 1 天,Python 工程师找工作更难了?
Python 是最神奇的编程语言. 无意引战,我说的是"神奇",不是"最好",并不想去"撼动" PHP 的地位. ...
- 使用系统自带的GCD的timer倒计时模板语句遇到的小坑。。
今天折腾了下系统gcd的 但是如果不调用这句dispatch_source_cancel()那么这个timer根本不工作....解决方法如下: 实现一个倒计时用自带的gcd如此简洁.. 原因可能是如果 ...
- 倒计时的js实现 倒计时 js Jquery
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=987 一.如火如荼的团 ...
- jQuery倒计时插件
倒计时jQuery插件 引言 最近又换工作了,还不错,我换工作的次数其实有点频繁,2014年7月份毕业,到现在工作已经换了3份了,工资跟刚毕业时候相比也涨了点儿,最近一次换工作我离开了深圳,来到了北京 ...
- 使用js倒计时还有几天及计时过了几天
公司主营业务是体育赛事为主的:尤其是足球赛事.现正值2016法国欧洲杯:之前忙于做欧洲杯专题没时间总结.现分享一个工作中需求带来的经历. 需求是:从现在开始倒计时欧洲杯还有多久开赛:当开赛之后开始计算 ...
随机推荐
- bootstrap-table分页第二篇 延续上一篇的
这个是service/** * 返回记录数 * @return */ public Integer getPageTotal(Integer userid); //service的实现类 public ...
- Linux-/proc目录简介
Linux /proc目录简介 1.简单了解 以文件系统的方式为访问系统内核数据的操作提供接口 由linux内核提供:通过/proc文件系统,在运行时访问内核内部数据结构.改变内核设置的一种机制 pr ...
- 在ubuntu下安装google chrome
由于手上有两台电脑,再加上我那个选择困难症加上纠结劲.所以果断把其中一台电脑只装linux系统,另一台电脑只装windows了.免得我老纠结!于是linux便选择了ubuntu. 由于浏览器一直用的是 ...
- Javascript中数组的基本操作
删除数组指定的某个元素 via首先可以给JS的数组对象定义一个函数,用于查找指定的元素在数组中的位置,即索引,代码为: Array.prototype.indexOf = function(val) ...
- 分割一个表到多个实体<EntityFramework6.0>
声明方式 public class Photograph { [Key] [DatabaseGenerated(DatabaseGeneratedOption.Identity)] public in ...
- sql基础大全
- Spring MVC重定向和转发及异常处理
SpringMVC核心技术---转发和重定向 当处理器对请求处理完毕后,向其他资源进行跳转时,有两种跳转方式:请求转发与重定向.而根据要跳转的资源类型,又可分为两类:跳转到页面与跳转到其他处理器.对于 ...
- memcache的lru删除机制
惰性删除,get时才删除 LRU原理:当某个单元被请求的时候,维护一个计数器,通过计数器来判断最近谁最少使用,那就把谁踢出去. 注:即使某个key设置的永久有效,也会被踢出来,这个就是永久数据被踢的现 ...
- Swift学习之熟悉控件
最近是比较清闲一些的,对于一个开发者来说,这也是一个很好的充电机会.以前做项目都是使用Objective-C去开发,但我们都知道,Swift语言从2014年的出现到现在,一步一步变的完善,渐渐变的受欢 ...
- three.js立方体
<!DOCTYPE html> <html lang="en"> <head> <title>three.js webgl - ge ...