当前位置: 代码迷 >> Web前端 >> 一个简略的时钟显示和暂停
  详细解决方案

一个简略的时钟显示和暂停

热度:112   发布时间:2012-10-14 14:55:08.0
一个简单的时钟显示和暂停

?时钟的显示和暂停(setTimeout和clearTimeout的用法):

<script type="text/javascript">
  var iTimeoutId=0;
  function mytime(){
   var d=new Date();
   var year=d.getFullYear();//
   var month=d.getMonth()+1;//返回月份
   if(month<10){
    month="0"+month;
   }
   var date=d.getDate();//返回该日期该月中的某天
   if(date<10){
    date="0"+date;
   }
   var hour=d.getHours();//返回日期中的小时值
   var minute=d.getMinutes();
   if(minute<10)
    minute="0"+minute;
   var second=d.getSeconds();
   if(second<10)
    second="0"+second;
   //返回日期中的毫秒值
   var milesecond=d.getMilliseconds();
   var time=year+"年"+month+"月"+date+"日"+" "+hour+":"+minute+":"+second+":"+milesecond;
   document.all.t.value=time;
   iTimeoutId=setTimeout(mytime,10);
  }
  function pauseLock(){
   clearTimeout(iTimeoutId);
  }
 </script>
  </head>
  <body onload="mytime();">
   <p align="center">
    <input type="text" name="t" id="t" size="30"/>
   </p>
   <p align="center">
    <a href="javascript:pauseLock();">暂停</a>
     <a href="javascript:mytime();">继续</a>
   </p>
  </body>

?

同样也可以使用(setInterval和clearInterval的方法来实现该功能):

<script type="text/javascript">
		var iTimeoutId=0;
		function mytime(){
			var d=new Date();
			var year=d.getFullYear();//
			var month=d.getMonth()+1;//返回月份
			if(month<10){
				month="0"+month;
			}
			var date=d.getDate();//返回该日期该月中的某天
			if(date<10){
				date="0"+date;
			}
			var hour=d.getHours();//返回日期中的小时值
			var minute=d.getMinutes();
			if(minute<10)
				minute="0"+minute;
			var second=d.getSeconds();
			if(second<10)
				second="0"+second;
			//返回日期中的毫秒值
			var milesecond=d.getMilliseconds();
			var time=year+"年"+month+"月"+date+"日"+" "+hour+":"+minute+":"+second+":"+milesecond;
			document.all.t.value=time;
		}
		iTimeoutId=setInterval(mytime,10);
		function play(){
			iTimeoutId=setInterval(mytime,10);
		}
		function pauseLock(){
			clearInterval(iTimeoutId);
		}
	</script>
  </head>
  <body onload="mytime();">
  	<p align="center">
  		<input type="text" name="t" id="t" size="30"/>
  	</p>
  	<p align="center">
  		<a href="javascript:pauseLock();">暂停</a>
    	<a href="javascript:play();">继续</a>
  	</p>

?

  相关解决方案