JS 實現的定時倒計時

時間 2019-11-17
原文原文鏈接
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標題文檔</title>
<mce:script type="text/javascript" src="jquery.js" mce_src="jquery.js"></mce:script>
<mce:script type="text/javascript"><!--
	function timesup(){
			alert("結束");
		}
	
function clock(options){
	if(!options){
		options = '()';
	}
	
	if(options.beginTime == null || options.beginTime == '' || options.beginTime == 'undefined'){
		if(options.callback){
			eval(options.callback);
		}
		return null;
	}
	
	var obj = $("#"+options.id);
	var $days = $("#"+options.days);
	var $hours = $("#"+options.hours);
	var $mins = $("#"+options.mins);
	var $secs = $("#"+options.secs);
	
	$days.html("00");
	$hours.html("00");
	$mins.html("00");
	$secs.html("00");
	
	var DifferenceHour = -1
	var DifferenceMinute = -1
	var DifferenceSecond = -1
	var Tday = new Date(options.beginTime);
	var time = new Date()
	var daysms = 24 * 60 * 60 * 1000
	var hoursms = 60 * 60 * 1000
	var Secondms = 60 * 1000
	var microsecond = 1000
	var convertHour = DifferenceHour
	var convertMinute = DifferenceMinute
	var convertSecond = DifferenceSecond;
	var Diffms = Tday.getTime() - time.getTime();
	
	if(Diffms>0){		
		DifferenceHour = Math.floor(Diffms / daysms)
		Diffms -= DifferenceHour * daysms
		DifferenceMinute = Math.floor(Diffms / hoursms)
		Diffms -= DifferenceMinute * hoursms
		DifferenceSecond = Math.floor(Diffms / Secondms)
		Diffms -= DifferenceSecond * Secondms
		var dSecs = Math.floor(Diffms / microsecond)
		if(convertHour != DifferenceHour){
			DifferenceHour = (DifferenceHour>9?"":"0")+DifferenceHour;
			$days.html(DifferenceHour+" ");
		}
		if(convertMinute != DifferenceMinute){
			DifferenceMinute = (DifferenceMinute>9?"":"0")+DifferenceMinute;
			$hours.html(DifferenceMinute+" ");
		}
		if(convertSecond != DifferenceSecond){
			DifferenceSecond = (DifferenceSecond>9?"":"0")+DifferenceSecond;
			$mins.html(DifferenceSecond+" ");
		}
		$secs.html((dSecs>9?"":"0")+dSecs);
		// document.formnow.Tnow.value= DifferenceHour DifferenceMinute + DifferenceSecond + dSecs
		setTimeout(function(){clock(options)},1000)
	}else{
		eval(options.callback);
	}
}
	
	$(function(){
		clock({
			id:"countdown",
			days:"dd",
			hours:"hh",
			mins:"mmm",
			secs:"ss",
			beginTime:'2011/06/27 16:35',
			callback: 'timesup()'
		});
		clock({
			days:"tiemD",
			hours:"tiemH",
			mins:"tiemM",
			secs:"tiemS",
			beginTime:'2011/06/24 17:45',
			callback: 'timesup()'
		});
	})
// --></mce:script>
</head>

<body>
<table id="countdown" width="500" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td width="36" align="center" id="yy"> </td>
    <td width="29" align="center">年</td>
    <td width="41" align="center" id="mm"> </td>
    <td width="26" align="center">月</td>
    <td width="52" align="center" id="dd"> </td>
    <td width="33" align="center">日</td>
    <td width="60" align="center" id="hh"> </td>
    <td width="27" align="center">時</td>
    <td width="39" align="center" id="mmm"> </td>
    <td width="41" align="center">分</td>
    <td width="56" align="center" id="ss"> </td>
    <td width="34" align="center">秒</td>
  </tr>
</table>
<br/>
<table width="697" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <td width="90" align="center"> </td>
    <td width="472" align="center"><span id="tiemD"></span>天<span id="tiemH"></span>小時<span id="tiemM"></span>分<span id="tiemS"></span>秒</td>
    <td width="127" align="center"> </td>
  </tr>
  <tr>
    <td align="center"> </td>
    <td align="center"> </td>
    <td align="center"> </td>
  </tr>
  <tr>
    <td align="center"> </td>
    <td align="center"> </td>
    <td align="center"> </td>
  </tr>
</table>




</body>
</html>
相關標籤/搜索
每日一句
每一个你不满意的现在，都有一个你没有努力的曾经。