基于js对时间动态控制显示。
2009-09-10 12:19
513 查看
最近项目中使用有个需求是按照流程挂起时间开始 进行统计,时间过去多久了 显示格式XX天XX小时XX分XX秒,后台已有该流程挂起时间。需要动态刷新时间,只能使用javascript对时间进行即使显示了。
为了提高代码的复用性,写了基于面向对象的 对时间控制的类。代码如下:
为方便输出显示格式,我将显示代码分离在前台页面,代码如下:
至此,脚本上增加setInterval( "DisplayTime(显示控件id,挂起时间)",1000 );即可以使用了。
一个页面多个流程要挂起,只要传递对应的控件id,跟获取到对应的挂起时间就可以了。
为了提高代码的复用性,写了基于面向对象的 对时间控制的类。代码如下:
//Time对象 function TimeCom(Value) { var newCom = new Date(value); this.year = newCom.getYear(); this.month = newCom.getMonth()+1; this.day = newCom.getDate(); this.hour = newCom.getHours(); this.minute = newCom.getMinutes(); this.second = newCom.getSeconds(); this.msecond = newCom.getMilliseconds(); this.week = newCom.getDay(); } //对日期相减,并计算得出结果,返回两个时间的相差秒数 function DateDiff(begindate,enddate) { var TimeCom1 = new TimeCom(begindate); var TimeCom2 = new TimeCom(enddate); var result; //转换为标准的格林尼治时间进行计算 return Math.round((Date.UTC(TimeCom1.year,TimeCom1.month- 1,TimeCom1.day,TimeCom1.hour,TimeCom1.minute,TimeCom1.second)-Date.UTC(TimeCom2.year,TimeCom2.month- 1,TimeCom2.day,TimeCom2.hour,TimeCom2.minute,TimeCom2.second))/1000); } //通过DateDiff返回的结果计算显示需要的数据 function TimeGet(Value) { var secondTotal=parseInt(Value) this.day=Math.round(secondTotal/(60*60*24)); secondTotal=secondTotal%(60*60*24); this.hour=Math.round(secondTotal/(60*60)); secondTotal=secondTotal%(60*60); this.minute=Math.round(secondTotal/(60)); secondTotal=secondTotal%(60); this.second=secondTotal; }
为方便输出显示格式,我将显示代码分离在前台页面,代码如下:
//listID 是显示结果,time 流程挂起时间。 function DisplayTime(listID,Time) { var TimeNow=new Date(); var StopTime=new Date(Time); var secondTotal= DateDiff(TimeNow,StopTime); var timget=new TimeGet(secondTotal); $(listID).html("<font color='red'>"+timget.day+"天"+timget.hour+"小时"+timget.minute+"分"+timget.second+"秒</font>"); }
至此,脚本上增加setInterval( "DisplayTime(显示控件id,挂起时间)",1000 );即可以使用了。
一个页面多个流程要挂起,只要传递对应的控件id,跟获取到对应的挂起时间就可以了。
相关文章推荐
- js动态显示当前日期,时间和星期代码
- js利用时间戳动态显示系统时间距指定时间的时间差
- js 实现页面动态显示时间
- js动态显示当前日期,时间和星期代码
- 天易01----js实现定时关闭网页并动态显示时间
- 基于javascript实现动态显示当前系统时间
- js 动态显示时间(setTimeout)
- js 日期时间动态显示,星期用星期几来显示
- JS实现动态显示当前时间(12/24小时制)
- JS显示动态显示当前时间代码
- js显示动态时间
- js动态显示时间
- JS动态显示时间
- C/C++控制动态显示当前系统时间
- html+js实现动态显示本地时间
- js动态显示当前日期,时间和星期代码
- js动态控制td隐藏显示 jquery 动态控制td被另一个td代替,非常实用
- js下调用动态显示当前时间(兼容ie和火狐)
- 纯js实现动态时间显示
- JS--时间器控制图片显示