JS实现动态显示当前时间(12/24小时制)

今天又要用到动态显示当前时间,且要求可以切换24/12小时制, 记得很久前写过一个24小时制的,但一时没能找着, 于是又重新写了个,若有需要的朋友自行复制粘贴一份吧.
很简单的一个功能函数,实现方式不多言,用Date()对象获取到当前时间,然后用setTimeout每隔1秒获取最新的时间.
写的过程中碰到过一个小小的问题: 我最初的想法是用setInterval()每隔1秒获取最新时间,可是可以,但setInterval如果放在主函数内部,但导致内存泄漏(至于原因,暂时还没想明白),后来在Rocky的提醒下用setTimeout()才解决内存泄漏问题,感谢Rocky同学:)
核心代码及演示查看样例演示

function nowTime(ev,type){
	/*
	 * ev:显示时间的元素
	 * type:时间显示模式.若传入12则为12小时制,不传入则为24小时制
	 */
	//年月日时分秒
	var Y,M,D,W,H,I,S;
	//月日时分秒为单位时前面补零
	function fillZero(v){
		if(v<10){v='0'+v;}
		return v;
	}
	(function(){
		var d=new Date();
		var Week=['星期天','星期一','星期二','星期三','星期四','星期五','星期六'];
		Y=d.getFullYear();
		M=fillZero(d.getMonth()+1);
		D=fillZero(d.getDate());
		W=Week[d.getDay()];
		H=fillZero(d.getHours());
		I=fillZero(d.getMinutes());
		S=fillZero(d.getSeconds());
		//12小时制显示模式
		if(type && type==12){
			//若要显示更多时间类型诸如中午凌晨可在下面添加判断
			if(H<=12){
				H='上午 '+H;
			}else if(H>12 && H<24){
				H-=12;
				H='下午 '+fillZero(H);
			}else if(H==24){
				H='下午 00';
			}
		}
		ev.innerHTML=Y+'年'+M+'月'+D+'日 '+' '+W+' '+H+':'+I+':'+S;
		//每秒更新时间
		setTimeout(arguments.callee,1000);
	})();
}
共有 5 条评论.

发表评论22,528 Views

  1. 屌炸天

    看起来好麻烦

    [回复]

  2. 发现一个问题就是,刚打开演示页面的时候12小时制和24小时制时间是同步的,就是秒显示,但是过一段时间发现24小时制较12小时制秒显有延迟,大约蛮了0.5秒。不知道是什么原因

    [回复]

  3. 本地时间基本上就用不到,如果是当前的北京时间那就好了,因为用户电脑上的本地时间不一定是对的。
    另外:博主有时间得话搞个weather.com.cn的js代码吧,干净的显示如”北京 阴 10℃-20℃,没有任何多余链接,我看到非常多站长想要这个。

    [回复]

  4. 演示的头部样式很舒服撒~

    [回复]

    Mr.Think 回复:

    @林木木, 哈,很业余~

    [回复]

发表评论[无需注册]


渔夫科技