js活动倒计时

时间:2022-09-08 16:16:54

html代码:

<div class="endtime" value=""></div>
<div class="endtime" value=""></div>
<div class="endtime" value=""></div>
<div class="endtime" value=""></div>

js代码:

var serverTime = ; //服务器时间,毫秒数
$(function(){
var dateTime = new Date();
var difference = dateTime.getTime() - serverTime; //客户端与服务器时间偏移量 setInterval(function(){
$(".endtime").each(function(){
var obj = $(this);
endTime = new Date(parseInt(obj.attr('value')) * ),
nowTime = new Date();
nMS=endTime.getTime() - nowTime.getTime() + difference,
myD=Math.floor(nMS/( * * * )); //天
myH=Math.floor(nMS/(1000 * 60 * )) % , //小时
myM=Math.floor(nMS/(1000 * )) % , //分钟
myS=Math.floor(nMS/) % , //秒
myMS=Math.floor(nMS/) % ; //拆分秒
if(myD>= ){
var str = myD+"天"+myH+"小时"+myM+"分"+myS+"."+myMS+"秒";
}else{
var str = "已结束!";
}
obj.html(str);
});
}, ); //每0.1秒执行一次
});

注解:

每个活动定义了结束时间.endtime属性value的值,这个值是一串数字,表示自1970年1月1日以来的秒数,由后台(PHP)生成。比如结束时间2013-05-01 12:00可以通过PHP转换为1367380800秒,转换后的秒数可以用来接下来的jQuery计算倒计时。

js活动倒计时的更多相关文章

  1. 一个简单的js实现倒计时函数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 活动倒计时代码(精确到毫秒)jquery插件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. js&sol;jq 倒计时插件(一)

    //很多时候我们需要用到倒计时比如(一些发布会倒计时,秒杀倒计时,活动倒计时等),接下来将介绍两种倒计时插件的写法 //html结构 <!DOCTYPE html> <html la ...

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

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

  5. js时间倒计时

    看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...

  6. js实现倒计时及时间对象

    JS实现倒计时效果代码如下: <!doctype html> <html> <head> <meta charset="utf-8"&gt ...

  7. js 验证码 倒计时60秒

    js 验证码 倒计时60秒 <input type="button" id="btn" value="免费获取验证码" /> & ...

  8. JS实现倒计时&lpar;天数&comma;时&comma;分&comma;秒&rpar;

    <!DOCTYPE html> <html> <head>   <meta charset="utf-8" >   <titl ...

  9. 使用html&plus;css&plus;js实现倒计时,开启你痛苦的倒计时吧

    使用html+css+js实现倒计时,开启你痛苦的倒计时吧 效果图: 这是我痛苦的倒计时,呜呜呜 好啦,再痛苦还是要分享代码,代码如下,复制即可使用: <!DOCTYPE html> &l ...

随机推荐

  1. &lbrack;Hadoop&rsqb; Hadoop学习历程 &lbrack;持续更新中…&rsqb;

    1. Hadoop FS Shell Hadoop之所以可以实现分布式计算,主要的原因之一是因为其背后的分布式文件系统(HDFS).所以,对于Hadoop的文件操作需要有一套全新的shell指令来完成 ...

  2. 如何更改Magento的Base URL

    Magento的Base URL是用于访问商店页面的URL,您也可以为单独一个store view设置一个Base Url.在改这项值之前请确保您的域名已经指向了网站所在服务器的IP,DNS解析完成后 ...

  3. openldap安装配置

    http://www.jslink.org/linux/openldap-ssl-sssd.html http://www.unix-power.net/centos7/openldap.html h ...

  4. Tri&lowbar;integral Summer Training 5 总结

    比赛 题目 B D E G H I J 这是泰国的一场区域赛,除了C题英语非常抽以外,其余题目还不算难读. 一开场就发现了三道很水的题目,0:21:34就把三道题给过了,都是1A,赞Moor的手速. ...

  5. Redis之List

    一.Redis之List简介 1. List是简单的字符串列表,按照插入顺序排列. 2. 一个列表最多可存储232-1个元素(40多亿). 二.Redis之List命令行操作 Lrange:获取列表指 ...

  6. Spark源码编译,官网学习

    这里以spark-1.6.0版本为例 官网网址   http://spark.apache.org/docs/1.6.0/building-spark.html#building-with-build ...

  7. 二、JavaScript基础(2)

    BOM基础加强 1.浏览器对象BOM DOM Window DOM Navigator DOM Screen DOM History DOM Location 2.浏览器对象的使用 History H ...

  8. (转)使用 Spring缓存抽象 支持 EhCache 和 Redis 混合部署

    背景:最近项目组在开发本地缓存,其中用到了redis和ehcache,但是在使用注解过程中发现两者会出现冲突,这里给出解决两者冲突的具体方案. spring-ehcache.xml配置: <?x ...

  9. mybatis3 前台传数组 的处理

    /** * 分页按条件查询权限列表 * @param keywords * @return */ @RequestMapping(value = "/getByCondition2&quot ...

  10. 音频 API 一览

    iOS 和 OS X 平台都有一系列操作音频的 API,其中涵盖了从低到高的全部层级.随着时间的推移.平台的增长以及改变,不同 API 的数量可以说有着非常巨大的变化.本文对当前可以使用的 API 以 ...