最近在弄一个倒计时抽奖的项目,由于是每天的某个时间段所以,网上也没有找到自己合适的。就自己写了一个留下来以供参考。其中最值得注意的一点是不同种类型的手机对自定义的时间支持方式是不一样的。苹果时间只能支持/ 不支持- 安卓都可行。

下面是代码。

 <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倒计时的更多相关文章

  1. 工作总结_js

    工作至今已经有7个月了,虽然有进步,但是总感觉还是什么都不知道.可能这其中很大一部分还是与自己有关系,遇到自己不知道,问了人,或者百度到了,但是自己没有用心记.平时要用的时候,打开上一个项目,复制粘贴 ...

  2. react native中的聊天气泡以及timer封装成的发送验证码倒计时

    今天看来情书写的文章,研究了一下大佬写的文章,自己做一点总结. 其实,今天我想把我近期遇到的坑都总结一下:1.goBack的跨页面跳转,又两种方法,一可以像兔哥那样修改navigation源码,二可以 ...

  3. 关于Java并发编程的总结和思考

    编写优质的并发代码是一件难度极高的事情.Java语言从第一版本开始内置了对多线程的支持,这一点在当年是非常了不起的,但是当我们对并发编程有了更深刻的认识和更多的实践后,实现并发编程就有了更多的方案和更 ...

  4. 【转】关于Java并发编程的总结和思考

    一.前言 就是想学习Java并发编程了,所以转载一下这篇认为还不错的博客~ 二.正文 编写优质的并发代码是一件难度极高的事情.Java语言从第一版本开始内置了对多线程的支持,这一点在当年是非常了不起的 ...

  5. 2020 倒计时 1 天,Python 工程师找工作更难了?

    Python 是最神奇的编程语言. 无意引战,我说的是"神奇",不是"最好",并不想去"撼动" PHP 的地位.               ...

  6. 使用系统自带的GCD的timer倒计时模板语句遇到的小坑。。

    今天折腾了下系统gcd的 但是如果不调用这句dispatch_source_cancel()那么这个timer根本不工作....解决方法如下: 实现一个倒计时用自带的gcd如此简洁.. 原因可能是如果 ...

  7. 倒计时的js实现 倒计时 js Jquery

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=987 一.如火如荼的团 ...

  8. jQuery倒计时插件

    倒计时jQuery插件 引言 最近又换工作了,还不错,我换工作的次数其实有点频繁,2014年7月份毕业,到现在工作已经换了3份了,工资跟刚毕业时候相比也涨了点儿,最近一次换工作我离开了深圳,来到了北京 ...

  9. 使用js倒计时还有几天及计时过了几天

    公司主营业务是体育赛事为主的:尤其是足球赛事.现正值2016法国欧洲杯:之前忙于做欧洲杯专题没时间总结.现分享一个工作中需求带来的经历. 需求是:从现在开始倒计时欧洲杯还有多久开赛:当开赛之后开始计算 ...

随机推荐

  1. Hexo博客建设

    上次我教大家利用wordpress程序搭建个人网站,这次换个Hexo来搭建咱们的个人博客,那咱们开始吧!先提供官网给大家英文版的请点击这里,中文版的请点击这里,好了然后是工具要准备下,貌似就只要安装g ...

  2. HTTP访问错误大全

    400 - 错误的请求. ·401 - 访问被拒绝.IIS 定义了许多不同的 401 错误,它们指明更为具体的错误原因.这些具体的错误代码在浏览器中显示,但不在 IIS 日志中显示: ·401.1 - ...

  3. 获取url中指定的参数

    function GetRequest(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)(& ...

  4. GTest Google的一种白盒单元测试框架 开源项目

    GTest为google开源的白盒单元测试跨平台测试框架,含丰富的断言.类型参数化测试.死亡测试.以及其他的测试选项设置.文件保存等,以下将对该项目C++的实现进行简要的分析,作为学习记录备份. 基本 ...

  5. npm设计代理

    概述: 在需要代理才能上网的环境下,需要给npm设置代理才能完成安装  npm install 代理设置: 直接使用npm install会报错,如下: npm ERR! node v6.7.0 np ...

  6. 动态更换应用Icon

    转:原理1--activity-alias 在AndroidMainifest中,有两个属性: // 决定应用程序最先启动的Activity android.intent.action.MAIN // ...

  7. the beginner's guide to idapython

    之前做的一个idapython的翻译,http://bbs.pediy.com/showthread.php?p=1432784#post1432784

  8. MOD

    题目链接:http://acm.hrbust.edu.cn/index.php?m=ProblemSet&a=showProblem&problem_id=2318 ///这是哈理工校 ...

  9. 安卓智能POS开单神器-成为零售批发商亲睐的生意帮手-pda销售扫描开单 现场结算打印凭据

    pda销售开单主要有盘点.出库.入库.销售等操作. 主要功能: 出库作业(销售开单.销售退货.销售赠品).入库作业(进货开单.进货退货.进货赠品).盘点作业(能盘盈盘亏)等操作,带蓝牙打印功能 3.仓 ...

  10. 一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

    行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10 2012-04-25 16:29:04| 分类: 学习 |字号 订阅 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE ...