当前位置:首页 > 日记 > 正文

jquery实现一个全局计时器 | 商城可用

jquery实现一个全局计时器 | 商城可用

本文实例为大家分享了商城一类都可以使用的jquery全局计时器,供大家参考,具体内容如下

实现思路

遍历所有待计时元素,添加一个setInterval计时函数,每隔X秒执行更新计时操作(中间可能还有格式化时间操作)。

代码实现

ps:JQ元素通过arr[i]取值时会转变成DOM元素,dom元素和JQ之间转换用 $(arr[i])

获取所有待计时元素

var arrList =$(".stime");setInterval(function(){ //遍历数组 for(var i = 0,l = arrList.length; i<l ;i++ ){  var elem = arrList[i];  //格式化时间插入HTML文档  $(elem).html(DateDiff( new Date(), new Date($(elem).attr("time") ), elem )); }},1000);

计算时间函数,可倒可正

ps:如果是Java后台传过来的时间,注意下时间格式,这里已经做了处理(是个坑点);

/*DateDiff 处理*/function DateDiff(t1, t2, elem){ //GTM CST 时间相差14小时  var diff = t1.setHours(t1.getHours()+14) - Date.parse(t2); //超过一天显示warning色 if(diff>(1000*60*60*24)){  $(elem).css({color:"rgb(247, 186, 42)"}); } return ShowTime(diff);}

显示处理函数,可自行选择精确度

不需要,注释掉即可

/*fuc 计时显示处理*/function ShowTime(ms){ var obj = {  "天" : 1000*60*60*24,  "时" : 1000*60*60,  "分" : 1000*60  /*  "秒" : 1000  */ }; var tmp = ms; var str = ""; for( var i in obj ){  //向下取整 1.5天 => 1天  s = Math.floor( tmp / obj[i] );  tmp = tmp % obj[i];  str += s+i; } return str;}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

相关文章

excel2007怎样删除宏教程

excel2007怎样删除宏教程

删除,方法,教程,电脑软件,  excel宏或许对于新手来说显得高大上,但是也有不用的时候,那么要怎样删除宏呢?下面小编马上就告诉大家excel2007删除宏的方法吧,希望小编整理的资料对大家有用。excel2007删除宏的方法我在电脑桌面上自建了一个名…

PS制作一个漂亮的水晶按钮

PS制作一个漂亮的水晶按钮

按钮,水晶,漂亮,电脑软件,PS,但我们在流量网页的时候经常看到一些漂亮的水晶按钮。这些按钮是如何制作的呢?接下来我通过混合模式、浮雕效果来制作一个水晶按钮,下面我们来看看吧。最终效果图:1. 新建一个文件,快捷键是ctrl+n。2. 在工具栏选择…

excel 公式栏消失了的解决教程

excel 公式栏消失了的解决教程

教程,公式,消失了,电脑软件,excel,  在Excel中经常需要用到公示栏来编辑公式函数,但因为某种原因而导致公式栏消失了,这个时候只需要我们简单设置几步就可以把公示栏消失了的问题解决了。下面是由小编分享的excel 公式栏消失了的解决教程,以…

excel跨表格快速匹配查找数据的方

excel跨表格快速匹配查找数据的方

方法,数据,查找,表格,快速,  Excel中需要跨表查找匹配数据,跨表格具体该如何做到快速匹配查找数据呢?下面是由小编分享的excel跨表格快速匹配查找数据的方法,以供大家阅读和学习。excel跨表格快速匹配查找数据的方法跨表匹配查找数据步骤1:…

用JS编写一个函数,返回数组中重复

用JS编写一个函数,返回数组中重复

元素,组中,实例,一个函数,电脑软件,用JS编写一个函数,返回数组中重复出现过的元素,见下面的代码:var arr = [1, 2, 3, 1, 2, 3, 4, 5]; var getRepeat = function (arr) { var obj = {}; for (var i = 0, len = arr.length; i < len; i…

PS快速打造精美山水画海报的教程

PS快速打造精美山水画海报的教程

教程,山水画,海报,精美,快速,今天给大家带来的教程是,应用PS打造精美的山水画海报,我们来看一看效果。软件名称:Adobe Photoshop 8.0 中文完整绿色破解版软件大小:150.1MB更新时间:2015-11-04OK那么开始我们今天的教程1、将素材拖拽进PS。老规矩…

详解Vue用axios发送post请求自动se

详解Vue用axios发送post请求自动se

请求,详解,电脑软件,Vue,post,vue-resource不再维护之后,我也用起了axios,但是死活无法设置服务器发送过来的cookie后来查询文档发现,这个是要单独配置的。// `withCredentials` indicates whether or not cross-site Access-Control requests…

vue模板语法-插值详解

vue模板语法-插值详解

插值,模板,语法,详解,电脑软件,1.文本数据绑定最常见的形式就是使用‘Mustache'语法(双打括号)的文本插值:<span>message:{{msg}}</span>使用v-once指令,也能执行一次性的插值,当主句改变时,插值处的内容不会更新。但请留心这回影响到该节点上所…

浅析JS中的 map, filter, some, ev

浅析JS中的 map, filter, some, ev

电脑软件,map,JS,forEach,filter,1.map有返回值,返回一个新的数组,每个元素为调用func的结果。let list = [1, 2, 3, 4, 5];let other = list.map((d, i) => { return d * 2;});console.log(other);// print: [2, 4, 6, 8, 10]2.filter有返…

react router 4.0以上的路由应用详

react router 4.0以上的路由应用详

路由,详解,电脑软件,react,router,本文介绍了react router 4.0以上的路由应用,分享给大家,具体如下:在4.0以下的react router中,嵌套的路由可以放在一个router标签中,形式如下,嵌套的路由也直接放在一起。<Route component={App}> <Route path=…

利用js查找数组中指定元素并返回该

利用js查找数组中指定元素并返回该

元素,查找,索引,示例,组中,前言这篇文章主要给大家介绍的是利用js查找数组中指定元素并返回该元素的所有索引的相关资料,文中给出了详细的示例代码,下面话不多说,来看看详细的代码示例吧。示例代码//在数组中查找所有出现的x,并返回一个包含匹…

PPT2007中怎样设置若隐若现的半透

PPT2007中怎样设置若隐若现的半透

设置,半透明,若隐若现,背景,效果,  半透明背景效果与水印效果大同小异,给我们一种若隐若现的朦胧美。此效果,不仅可以让文件显得更加的有创意,而且在PPT中还可以为幻灯片增色。以下是小编为您带来的关于PPT2007中设置若隐若现的半透明背景效…